/* Codentricks Pro Widgets Frontend CSS styling */

/* ==========================================================================
   1. SHARE BUTTONS WIDGET
   ========================================================================== */
.codentricks-share-buttons-container {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	width: 100%;
}

.codentricks-share-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	text-decoration: none !important;
	padding: 10px 18px;
	font-family: inherit;
	font-size: 13px;
	font-weight: 600;
	border-radius: 6px;
	gap: 8px;
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	box-shadow: 0 2px 6px rgba(0,0,0,0.05);
	cursor: pointer;
}

.share-icon-wrapper {
	display: flex;
	align-items: center;
	justify-content: center;
}

.share-svg {
	width: 16px;
	height: 16px;
	transition: transform 0.3s ease;
}

.codentricks-share-btn:hover .share-svg {
	transform: scale(1.15) rotate(-5deg);
}

.codentricks-share-empty {
	padding: 15px;
	background: #fff8e1;
	border-left: 4px solid #ffb300;
	color: #5d4037;
	font-size: 14px;
	border-radius: 4px;
}

/* Share Buttons Alignments */
.codentricks-share-align-left .codentricks-share-buttons-container { justify-content: flex-start; }
.codentricks-share-align-center .codentricks-share-buttons-container { justify-content: center; }
.codentricks-share-align-right .codentricks-share-buttons-container { justify-content: flex-end; }
.codentricks-share-align-justify .codentricks-share-btn { flex-grow: 1; }

/* Brand Colors (Flat theme) */
.codentricks-share-btn.share-facebook { background-color: #1877f2; color: #ffffff; }
.codentricks-share-btn.share-twitter { background-color: #000000; color: #ffffff; }
.codentricks-share-btn.share-linkedin { background-color: #0077b5; color: #ffffff; }
.codentricks-share-btn.share-whatsapp { background-color: #25d366; color: #ffffff; }
.codentricks-share-btn.share-telegram { background-color: #229ed9; color: #ffffff; }
.codentricks-share-btn.share-pinterest { background-color: #bd081c; color: #ffffff; }

.codentricks-share-btn:hover {
	transform: translateY(-3px);
	box-shadow: 0 6px 15px rgba(0, 0, 0, 0.15);
	filter: brightness(1.08);
}

/* Gradient Theme */
.style-gradient .codentricks-share-btn {
	color: #ffffff;
	position: relative;
	overflow: hidden;
}
.style-gradient .share-facebook { background: linear-gradient(135deg, #4f46e5 0%, #1877f2 100%); }
.style-gradient .share-twitter { background: linear-gradient(135deg, #1e293b 0%, #000000 100%); }
.style-gradient .share-linkedin { background: linear-gradient(135deg, #0284c7 0%, #0077b5 100%); }
.style-gradient .share-whatsapp { background: linear-gradient(135deg, #059669 0%, #25d366 100%); }
.style-gradient .share-telegram { background: linear-gradient(135deg, #0284c7 0%, #229ed9 100%); }
.style-gradient .share-pinterest { background: linear-gradient(135deg, #dc2626 0%, #bd081c 100%); }

/* Minimalist Outline Theme */
.style-minimal .codentricks-share-btn {
	background-color: transparent !important;
	border: 2px solid;
}
.style-minimal .share-facebook { border-color: #1877f2; color: #1877f2; }
.style-minimal .share-twitter { border-color: #000000; color: #1f2937; }
.style-minimal .share-linkedin { border-color: #0077b5; color: #0077b5; }
.style-minimal .share-whatsapp { border-color: #25d366; color: #059669; }
.style-minimal .share-telegram { border-color: #229ed9; color: #229ed9; }
.style-minimal .share-pinterest { border-color: #bd081c; color: #bd081c; }

.style-minimal .codentricks-share-btn:hover {
	color: #ffffff !important;
}
.style-minimal .share-facebook:hover { background-color: #1877f2 !important; }
.style-minimal .share-twitter:hover { background-color: #000000 !important; color: #ffffff !important; }
.style-minimal .share-linkedin:hover { background-color: #0077b5 !important; }
.style-minimal .share-whatsapp:hover { background-color: #25d366 !important; }
.style-minimal .share-telegram:hover { background-color: #229ed9 !important; }
.style-minimal .share-pinterest:hover { background-color: #bd081c !important; }

/* Floating Bubble Theme */
.style-bubble .codentricks-share-btn {
	border-radius: 50%;
	padding: 12px;
	aspect-ratio: 1 / 1;
}
.style-bubble .share-btn-label {
	display: none;
}

/* ==========================================================================
   2. POST GRID & LIST WIDGET
   ========================================================================== */
.codentricks-posts-container {
	display: grid;
	gap: 24px;
	width: 100%;
}

.codentricks-posts-container.layout-grid.cols-1 { grid-template-columns: 1fr; }
.codentricks-posts-container.layout-grid.cols-2 { grid-template-columns: repeat(2, 1fr); }
.codentricks-posts-container.layout-grid.cols-3 { grid-template-columns: repeat(3, 1fr); }
.codentricks-posts-container.layout-grid.cols-4 { grid-template-columns: repeat(4, 1fr); }

@media (max-width: 991px) {
	.codentricks-posts-container.layout-grid.cols-3,
	.codentricks-posts-container.layout-grid.cols-4 {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 600px) {
	.codentricks-posts-container.layout-grid {
		grid-template-columns: 1fr !important;
	}
}

.codentricks-post-card {
	background: #ffffff;
	border: 1px solid rgba(0, 0, 0, 0.07);
	border-radius: 12px;
	overflow: hidden;
	box-shadow: 0 4px 18px rgba(0, 0, 0, 0.04);
	display: flex;
	flex-direction: column;
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.codentricks-post-card:hover {
	transform: translateY(-6px);
	box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
	border-color: rgba(99, 102, 241, 0.2);
}

.codentricks-post-thumbnail-wrapper {
	position: relative;
	width: 100%;
	padding-top: 56.25%; /* 16:9 Aspect Ratio */
	overflow: hidden;
	background: #e2e8f0;
}

.codentricks-post-thumbnail-wrapper img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

.codentricks-post-card:hover .codentricks-post-img {
	transform: scale(1.08) rotate(1deg);
}

.codentricks-post-badge-category {
	position: absolute;
	top: 15px;
	left: 15px;
	background: rgba(99, 102, 241, 0.85);
	backdrop-filter: blur(8px);
	color: #ffffff;
	padding: 4px 10px;
	font-size: 11px;
	font-weight: 700;
	border-radius: 4px;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}

.codentricks-post-content {
	padding: 20px;
	display: flex;
	flex-direction: column;
	flex-grow: 1;
}

.codentricks-post-meta {
	display: flex;
	gap: 15px;
	font-size: 12px;
	color: #64748b;
	margin-bottom: 12px;
	font-weight: 500;
}

.meta-item {
	display: flex;
	align-items: center;
	gap: 4px;
}

.codentricks-post-title {
	font-size: 18px;
	font-weight: 700;
	margin: 0 0 10px 0;
	line-height: 1.4;
}

.codentricks-post-title a {
	color: #1e293b;
	text-decoration: none;
	transition: color 0.2s ease;
}

.codentricks-post-title a:hover {
	color: #6366f1;
}

.codentricks-post-excerpt {
	font-size: 14px;
	color: #475569;
	line-height: 1.6;
	margin-bottom: 20px;
	flex-grow: 1;
}

.codentricks-post-excerpt p {
	margin: 0;
}

.codentricks-post-footer {
	border-top: 1px solid rgba(0, 0, 0, 0.05);
	padding-top: 15px;
}

.codentricks-post-read-more {
	display: inline-flex;
	align-items: center;
	color: #6366f1;
	text-decoration: none !important;
	font-weight: 600;
	font-size: 13px;
	gap: 6px;
	transition: all 0.2s ease;
}

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

.codentricks-post-read-more:hover {
	color: #4f46e5;
}

.codentricks-post-read-more:hover .btn-arrow {
	transform: translateX(5px);
}

/* Post Row/List Layout Style */
.codentricks-posts-container.layout-list {
	grid-template-columns: 1fr;
}

.codentricks-posts-container.layout-list .codentricks-post-card {
	flex-direction: row;
}

.codentricks-posts-container.layout-list .codentricks-post-thumbnail-wrapper {
	width: 35%;
	padding-top: 0;
	min-height: 200px;
}

@media (max-width: 767px) {
	.codentricks-posts-container.layout-list .codentricks-post-card {
		flex-direction: column;
	}
	.codentricks-posts-container.layout-list .codentricks-post-thumbnail-wrapper {
		width: 100%;
		padding-top: 56.25%;
		min-height: auto;
	}
}

.codentricks-posts-empty {
	padding: 20px;
	text-align: center;
	border: 2px dashed #cbd5e1;
	border-radius: 8px;
	color: #64748b;
}

/* ==========================================================================
   3. CALL TO ACTION WIDGET
   ========================================================================== */
.codentricks-cta-container {
	position: relative;
	width: 100%;
	border-radius: 16px;
	overflow: hidden;
	padding: 60px 40px;
	box-shadow: 0 10px 30px rgba(0,0,0,0.05);
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	display: flex;
	align-items: center;
	justify-content: center;
}

.codentricks-cta-container.has-bg-image {
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

.codentricks-cta-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(15, 23, 42, 0.65); /* Slate 900 tint */
	z-index: 1;
}

.codentricks-cta-inner {
	position: relative;
	z-index: 2;
	max-width: 700px;
	width: 100%;
}

.codentricks-cta-badge {
	display: inline-block;
	font-size: 11px;
	font-weight: 800;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	color: #ffffff;
	background: linear-gradient(135deg, #a855f7 0%, #ec4899 100%);
	padding: 4px 12px;
	border-radius: 20px;
	margin-bottom: 20px;
	box-shadow: 0 4px 10px rgba(168, 85, 247, 0.3);
}

.codentricks-cta-heading {
	font-family: inherit;
	font-size: 32px;
	font-weight: 800;
	line-height: 1.25;
	margin: 0 0 15px 0;
}

.codentricks-cta-description {
	font-family: inherit;
	font-size: 16px;
	line-height: 1.6;
	margin: 0 0 30px 0;
}

.codentricks-cta-button-wrapper {
	margin-top: 10px;
}

.codentricks-cta-btn {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	text-decoration: none !important;
	padding: 14px 28px;
	font-size: 14px;
	font-weight: 700;
	color: #ffffff;
	border-radius: 8px;
	box-shadow: 0 4px 15px rgba(0,0,0,0.1);
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	cursor: pointer;
}

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

.codentricks-cta-btn:hover {
	transform: translateY(-3px);
	box-shadow: 0 8px 25px rgba(0,0,0,0.2);
}

.codentricks-cta-btn:hover .btn-icon {
	transform: translateX(6px);
}

/* Glassmorphism theme styling */
.theme-glassmorphism {
	background-color: rgba(15, 23, 42, 0.45);
	backdrop-filter: blur(16px);
	-webkit-backdrop-filter: blur(16px);
	border: 1px solid rgba(255, 255, 255, 0.08);
	box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.3);
	color: #ffffff;
}

.theme-glassmorphism .codentricks-cta-heading {
	color: #ffffff;
}

.theme-glassmorphism .codentricks-cta-description {
	color: rgba(255, 255, 255, 0.8);
}

.theme-glassmorphism .codentricks-cta-btn {
	background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);
	border: 1px solid rgba(255,255,255,0.1);
}

.theme-glassmorphism .codentricks-cta-btn:hover {
	background: linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%);
	box-shadow: 0 8px 25px rgba(99, 102, 241, 0.4);
}

/* Dark Theme */
.theme-dark {
	background-color: #0f172a;
	color: #ffffff;
	border: 1px solid rgba(255, 255, 255, 0.05);
}

.theme-dark .codentricks-cta-heading { color: #ffffff; }
.theme-dark .codentricks-cta-description { color: #94a3b8; }
.theme-dark .codentricks-cta-btn {
	background-color: #6366f1;
}
.theme-dark .codentricks-cta-btn:hover {
	background-color: #4f46e5;
}

/* Light Theme */
.theme-light {
	background-color: #f8fafc;
	color: #1e293b;
	border: 1px solid rgba(0, 0, 0, 0.06);
}

.theme-light .codentricks-cta-heading { color: #0f172a; }
.theme-light .codentricks-cta-description { color: #475569; }
.theme-light .codentricks-cta-btn {
	background-color: #0f172a;
}
.theme-light .codentricks-cta-btn:hover {
	background-color: #1e293b;
}

@media (max-width: 767px) {
	.codentricks-cta-container {
		padding: 40px 20px;
	}
	.codentricks-cta-heading {
		font-size: 24px;
	}
	.codentricks-cta-description {
		font-size: 14px;
	}
}

/* ==========================================================================
   4. WOOCOMMERCE PRODUCT CATEGORY WIDGET
   ========================================================================== */
.codentricks-prod-cat-grid {
	display: grid;
	gap: 24px;
	width: 100%;
}

.codentricks-prod-cat-grid.codentricks-prod-cat-cols-1 { grid-template-columns: 1fr; }
.codentricks-prod-cat-grid.codentricks-prod-cat-cols-2 { grid-template-columns: repeat(2, 1fr); }
.codentricks-prod-cat-grid.codentricks-prod-cat-cols-3 { grid-template-columns: repeat(3, 1fr); }
.codentricks-prod-cat-grid.codentricks-prod-cat-cols-4 { grid-template-columns: repeat(4, 1fr); }

@media (max-width: 1024px) {
	.codentricks-prod-cat-grid.codentricks-prod-cat-cols-3,
	.codentricks-prod-cat-grid.codentricks-prod-cat-cols-4 {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 640px) {
	.codentricks-prod-cat-grid {
		grid-template-columns: 1fr !important;
	}
}

.codentricks-prod-cat-card {
	background: #ffffff;
	border: 1px solid #f1f5f9;
	border-radius: 16px;
	overflow: hidden;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.03);
	display: flex;
	flex-direction: column;
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	position: relative;
}

.codentricks-prod-cat-card:hover {
	transform: translateY(-6px);
	box-shadow: 0 12px 30px rgba(0, 0, 0, 0.08);
	border-color: rgba(245, 158, 11, 0.15);
}

.codentricks-prod-cat-img-wrapper {
	position: relative;
	width: 100%;
	padding-top: 65%; /* 4:3 Aspect Ratio Cover Box */
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	overflow: hidden;
}

.codentricks-prod-cat-img-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 1) 100%);
	z-index: 1;
}

.codentricks-prod-cat-badge {
	position: absolute;
	top: 16px;
	left: 16px;
	background: #ffffff;
	border: 1px solid rgba(0, 0, 0, 0.04);
	border-radius: 20px;
	padding: 6px 14px;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
	z-index: 2;
}

.badge-icon-item {
	font-size: 13px;
	display: flex;
	align-items: center;
}

.badge-label-item {
	font-size: 10px;
	font-weight: 800;
	letter-spacing: 0.5px;
	color: #1e293b;
	text-transform: uppercase;
}

.codentricks-prod-cat-body {
	padding: 24px 24px 16px 24px;
	display: flex;
	flex-direction: column;
	flex-grow: 1;
}

.codentricks-prod-cat-tagline {
	font-size: 10.5px;
	font-weight: 800;
	letter-spacing: 1.2px;
	text-transform: uppercase;
	margin-bottom: 8px;
	display: block;
}

.codentricks-prod-cat-title {
	font-size: 18px;
	font-weight: 700;
	line-height: 1.4;
	margin: 0 0 10px 0;
}

.codentricks-prod-cat-title a {
	text-decoration: none !important;
	color: inherit;
	transition: color 0.2s ease;
}

.codentricks-prod-cat-title a:hover {
	color: #f59e0b;
}

.codentricks-prod-cat-desc {
	font-size: 13.5px;
	line-height: 1.6;
	margin: 0;
}

.codentricks-prod-cat-footer {
	border-top: 1px solid #f8fafc;
	padding: 16px 24px;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.codentricks-prod-cat-link {
	font-size: 13px;
	font-weight: 700;
	color: #1e293b;
	text-decoration: none !important;
	display: inline-flex;
	align-items: center;
	gap: 5px;
	transition: color 0.2s ease;
}

.footer-arrow {
	transition: transform 0.2s ease;
	display: inline-block;
}

.codentricks-prod-cat-link:hover {
	color: #f59e0b;
}

.codentricks-prod-cat-link:hover .footer-arrow {
	transform: translateX(4px);
}

.codentricks-prod-cat-footer-tag {
	background: #f8fafc;
	border: 1px solid #e2e8f0;
	color: #64748b;
	font-size: 9px;
	font-weight: 800;
	letter-spacing: 0.5px;
	padding: 4px 8px;
	border-radius: 4px;
	text-transform: uppercase;
	display: inline-block;
}

/* ==========================================================================
   5. CT  TESTIMONIAL WIDGET
   ========================================================================== */
.codentricks-testimonial-wrapper {
	width: 100% !important;
	padding: 40px 0 !important;
	background-color: transparent !important;
}

.codentricks-testimonial-header {
	text-align: center !important;
	margin-bottom: 56px !important;
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
}

.codentricks-testimonial-tagline {
	font-family: 'Plus Jakarta Sans', sans-serif !important;
	font-size: 11px !important;
	font-weight: 800 !important;
	letter-spacing: 1.5px !important;
	text-transform: uppercase !important;
	margin-bottom: 14px !important;
	display: block !important;
	color: #f97316 !important; /* Warm Orange tag */
}

.codentricks-testimonial-title {
	font-family: 'Plus Jakarta Sans', sans-serif !important;
	font-size: 38px !important;
	font-weight: 800 !important;
	color: #0c1b33 !important; /* Dark premium navy */
	margin: 0 !important;
	line-height: 1.2 !important;
	letter-spacing: -0.5px !important;
}

.codentricks-testimonial-grid {
	display: grid !important;
	grid-template-columns: repeat(3, 1fr) !important;
	gap: 28px !important;
	width: 100% !important;
}

@media (max-width: 991px) {
	.codentricks-testimonial-grid {
		grid-template-columns: repeat(2, 1fr) !important;
		gap: 24px !important;
	}
}

@media (max-width: 640px) {
	.codentricks-testimonial-grid {
		grid-template-columns: 1fr !important;
	}
	.codentricks-testimonial-title {
		font-size: 28px !important;
	}
}

.codentricks-testimonial-card {
	background: #ffffff !important;
	border: 1px solid #ffe4e6 !important; /* Soft rose border matching the screenshot */
	border-radius: 16px !important;
	padding: 36px 30px !important;
	display: flex !important;
	flex-direction: column !important;
	justify-content: space-between !important;
	box-shadow: 0 4px 24px rgba(0, 0, 0, 0.015) !important;
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.codentricks-testimonial-card:hover {
	transform: translateY(-6px) !important;
	box-shadow: 0 12px 30px rgba(12, 27, 51, 0.06) !important;
	border-color: rgba(245, 158, 11, 0.2) !important;
}

.codentricks-testimonial-stars {
	display: flex !important;
	gap: 4px !important;
	margin-bottom: 24px !important;
}

.codentricks-testimonial-stars .star-icon {
	font-size: 20px !important;
	line-height: 1 !important;
}

.codentricks-testimonial-stars .star-filled {
	color: #eab308 !important; /* Deep rich gold */
}

.codentricks-testimonial-stars .star-empty {
	color: #e2e8f0 !important;
}

.codentricks-testimonial-text {
	font-family: 'Inter', sans-serif !important;
	font-size: 13.5px !important;
	line-height: 1.8 !important;
	color: #475569 !important; /* Soft charcoal */
	font-style: italic !important;
	margin: 0 0 28px 0 !important;
	flex-grow: 1 !important;
}

.codentricks-testimonial-card-footer {
	border-top: 1px solid #f1f5f9 !important;
	padding-top: 20px !important;
	display: flex !important;
	justify-content: space-between !important;
	align-items: center !important;
	gap: 12px !important;
	margin-top: auto !important;
}

.author-details-group {
	display: flex !important;
	flex-direction: column !important;
	gap: 3px !important;
}

.author-name {
	font-family: 'Plus Jakarta Sans', sans-serif !important;
	font-size: 14.5px !important;
	font-weight: 700 !important;
	color: #0c1b33 !important; /* Match title */
	margin: 0 !important;
}

.author-designation {
	font-family: 'Inter', sans-serif !important;
	font-size: 11px !important;
	color: #64748b !important;
	line-height: 1.4 !important;
	font-weight: 500 !important;
}

.location-badge-pill {
	background: #f4f4f5 !important; /* Light grey pill */
	color: #52525b !important;
	font-family: 'Inter', sans-serif !important;
	font-size: 11px !important;
	font-weight: 600 !important;
	line-height: 1.35 !important;
	padding: 8px 12px !important;
	border-radius: 8px !important;
	text-align: left !important;
	max-width: 105px !important;
	white-space: normal !important;
	flex-shrink: 0 !important;
	word-wrap: break-word !important;
}

/* ==========================================================================
   6. CT  WHATSAPP DESK WIDGET
   ========================================================================== */
.codentricks-wa-desk-container {
	width: 100% !important;
	border-radius: 24px !important;
	padding: 60px 50px !important;
	background: linear-gradient(135deg, #f97316 0%, #db2777 100%) !important;
	box-shadow: 0 15px 35px rgba(219, 39, 119, 0.15) !important;
	overflow: hidden !important;
	box-sizing: border-box !important;
}

.codentricks-wa-desk-grid {
	display: grid !important;
	grid-template-columns: 1.1fr 0.9fr !important;
	gap: 48px !important;
	align-items: center !important;
}

@media (max-width: 991px) {
	.codentricks-wa-desk-grid {
		grid-template-columns: 1fr !important;
		gap: 40px !important;
	}
	.codentricks-wa-desk-container {
		padding: 40px 30px !important;
	}
}

@media (max-width: 768px) {
	.codentricks-wa-desk-container {
		padding: 30px 20px !important;
		border-radius: 16px !important;
	}
	.codentricks-wa-headline {
		font-size: 28px !important;
		line-height: 1.3 !important;
	}
}

@media (max-width: 480px) {
	.codentricks-wa-desk-container {
		padding: 24px 15px !important;
		border-radius: 12px !important;
	}
	.codentricks-wa-headline {
		font-size: 24px !important;
	}
	.codentricks-wa-description {
		font-size: 13.5px !important;
		margin-bottom: 20px !important;
	}
}

.codentricks-wa-left-panel {
	display: flex !important;
	flex-direction: column !important;
	color: #ffffff !important;
	text-align: left !important;
}

.codentricks-wa-tagline {
	font-family: 'Plus Jakarta Sans', sans-serif !important;
	font-size: 11px !important;
	font-weight: 800 !important;
	letter-spacing: 1.5px !important;
	color: #fde68a !important; /* Soft yellow/orange tag */
	text-transform: uppercase !important;
	margin-bottom: 12px !important;
	display: block !important;
}

.codentricks-wa-headline {
	font-family: 'Plus Jakarta Sans', sans-serif !important;
	font-size: 36px !important;
	font-weight: 800 !important;
	line-height: 1.2 !important;
	color: #ffffff !important;
	margin: 0 0 20px 0 !important;
	letter-spacing: -0.5px !important;
}

.codentricks-wa-description {
	font-family: 'Inter', sans-serif !important;
	font-size: 14.5px !important;
	line-height: 1.65 !important;
	color: rgba(255, 255, 255, 0.9) !important;
	margin: 0 0 30px 0 !important;
}

.codentricks-wa-checklist {
	list-style: none !important;
	padding: 0 !important;
	margin: 0 !important;
	display: flex !important;
	flex-direction: column !important;
	gap: 14px !important;
}

.codentricks-wa-checklist li {
	display: flex !important;
	align-items: flex-start !important;
	gap: 10px !important;
}

.wa-check-icon {
	color: #ffffff !important;
	font-weight: 900 !important;
	font-size: 14px !important;
	line-height: 1.2 !important;
	flex-shrink: 0 !important;
}

.wa-check-text {
	font-family: 'Inter', sans-serif !important;
	font-size: 13.5px !important;
	color: rgba(255, 255, 255, 0.95) !important;
	line-height: 1.4 !important;
}

.codentricks-wa-right-panel {
	width: 100% !important;
}

.codentricks-wa-form-card {
	background: #ffffff !important;
	border-radius: 16px !important;
	padding: 36px !important;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08) !important;
	box-sizing: border-box !important;
	width: 100% !important;
	max-width: 100% !important;
}

@media (max-width: 768px) {
	.codentricks-wa-form-card {
		padding: 28px 24px !important;
	}
}

@media (max-width: 480px) {
	.codentricks-wa-form-card {
		padding: 20px 15px !important;
	}
}

.codentricks-wa-form-title {
	font-family: 'Plus Jakarta Sans', sans-serif !important;
	font-size: 13px !important;
	font-weight: 800 !important;
	letter-spacing: 0.5px !important;
	color: #1e293b !important;
	text-transform: uppercase !important;
	margin: 0 0 24px 0 !important;
	text-align: left !important;
}

.codentricks-wa-sourcing-form {
	display: flex !important;
	flex-direction: column !important;
	width: 100% !important;
}

.wa-form-group {
	display: flex !important;
	flex-direction: column !important;
	gap: 8px !important;
	margin-bottom: 20px !important;
	width: 100% !important;
}

.wa-form-group label {
	font-family: 'Inter', sans-serif !important;
	font-size: 10px !important;
	font-weight: 800 !important;
	color: #64748b !important;
	letter-spacing: 0.5px !important;
	text-transform: uppercase !important;
	text-align: left !important;
}

.wa-form-control {
	background: #f8fafc !important;
	border: 1px solid #e2e8f0 !important;
	border-radius: 8px !important;
	padding: 12px 16px !important;
	font-family: 'Inter', sans-serif !important;
	font-size: 13.5px !important;
	color: #1e293b !important;
	box-sizing: border-box !important;
	width: 100% !important;
	min-width: 0 !important;
	max-width: 100% !important;
	transition: all 0.2s ease !important;
}

.wa-form-control:focus {
	outline: none !important;
	border-color: #db2777 !important;
	background: #ffffff !important;
	box-shadow: 0 0 0 3px rgba(219, 39, 119, 0.1) !important;
}

.codentricks-wa-submit-btn {
	width: 100% !important;
	max-width: 100% !important;
	border: none !important;
	border-radius: 8px !important;
	padding: 14px 20px !important;
	font-family: 'Plus Jakarta Sans', sans-serif !important;
	font-size: 13px !important;
	font-weight: 800 !important;
	letter-spacing: 0.5px !important;
	color: #ffffff !important;
	background-color: #db2777 !important; /* Magenta/Red button */
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	flex-wrap: wrap !important;
	white-space: normal !important;
	word-break: break-word !important;
	gap: 8px !important;
	cursor: pointer !important;
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
	box-shadow: 0 4px 12px rgba(219, 39, 119, 0.2) !important;
}

@media (max-width: 480px) {
	.codentricks-wa-submit-btn {
		font-size: 12px !important;
		padding: 12px 15px !important;
	}
}

.codentricks-wa-submit-btn:hover {
	transform: translateY(-2px) !important;
	box-shadow: 0 6px 15px rgba(219, 39, 119, 0.3) !important;
	filter: brightness(1.08) !important;
}

.wa-btn-svg {
	width: 16px !important;
	height: 16px !important;
	fill: currentColor !important;
	transition: transform 0.3s ease !important;
}

.codentricks-wa-submit-btn:hover .wa-btn-svg {
	transform: scale(1.15) rotate(-5deg) !important;
}

/* ==========================================================================
   7. WOOCOMMERCE WHATSAPP MODE
   ========================================================================== */
.codentricks-shop-filter-bar {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	background: #ffffff !important;
	border: 1px solid #f1f5f9 !important;
	border-radius: 16px !important;
	padding: 16px 24px !important;
	margin-bottom: 40px !important;
	box-shadow: 0 4px 15px rgba(0,0,0,0.015) !important;
	gap: 20px !important;
	flex-wrap: wrap !important;
	box-sizing: border-box !important;
}

.codentricks-shop-search-form {
	position: relative !important;
	flex: 1 1 280px !important;
	max-width: 400px !important;
}

.codentricks-shop-search-form .search-icon {
	position: absolute !important;
	left: 16px !important;
	top: 50% !important;
	transform: translateY(-50%) !important;
	color: #94a3b8 !important;
	font-size: 14px !important;
}

.codentricks-shop-search-form .search-field {
	width: 100% !important;
	background: #f8fafc !important;
	border: 1px solid #e2e8f0 !important;
	border-radius: 30px !important;
	padding: 12px 16px 12px 42px !important;
	font-family: 'Inter', sans-serif !important;
	font-size: 13.5px !important;
	color: #1e293b !important;
	box-sizing: border-box !important;
	outline: none !important;
	transition: all 0.2s ease !important;
}

.codentricks-shop-search-form .search-field:focus {
	border-color: #f97316 !important;
	background: #ffffff !important;
	box-shadow: 0 0 0 3px rgba(249, 115, 22, 0.1) !important;
}

.codentricks-shop-categories-pills {
	display: flex !important;
	align-items: center !important;
	gap: 10px !important;
	flex-wrap: wrap !important;
}

.codentricks-shop-categories-pills .pill-item {
	font-family: 'Plus Jakarta Sans', sans-serif !important;
	font-size: 12.5px !important;
	font-weight: 700 !important;
	color: #475569 !important;
	background: #f1f5f9 !important;
	padding: 8px 18px !important;
	border-radius: 30px !important;
	text-decoration: none !important;
	transition: all 0.25s ease !important;
	border: 1px solid transparent !important;
}

.codentricks-shop-categories-pills .pill-item:hover {
	background: #e2e8f0 !important;
	color: #0f172a !important;
}

.codentricks-shop-categories-pills .pill-item.active {
	background: linear-gradient(135deg, #f97316 0%, #ff5722 100%) !important;
	color: #ffffff !important;
	box-shadow: 0 4px 10px rgba(249, 115, 22, 0.2) !important;
}

.codentricks-shop-mfg-filter {
	display: flex !important;
	align-items: center !important;
	gap: 8px !important;
	font-family: 'Plus Jakarta Sans', sans-serif !important;
}

.codentricks-shop-mfg-filter .mfg-label {
	font-size: 11px !important;
	font-weight: 800 !important;
	color: #64748b !important;
	letter-spacing: 0.5px !important;
}

.codentricks-shop-mfg-filter .mfg-dropdown {
	background: #ffffff !important;
	border: 1px solid #e2e8f0 !important;
	border-radius: 30px !important;
	padding: 8px 18px !important;
	font-size: 12.5px !important;
	font-weight: 700 !important;
	color: #1e293b !important;
	cursor: pointer !important;
	box-shadow: 0 2px 4px rgba(0,0,0,0.02) !important;
}

/* Shop Loop overrides */
.archive.post-type-archive-product ul.products,
.tax-product_cat ul.products {
	display: grid !important;
	grid-template-columns: repeat(3, 1fr) !important;
	gap: 30px !important;
}

@media (max-width: 991px) {
	.archive.post-type-archive-product ul.products,
	.tax-product_cat ul.products {
		grid-template-columns: repeat(2, 1fr) !important;
		gap: 20px !important;
	}
}

@media (max-width: 640px) {
	.archive.post-type-archive-product ul.products,
	.tax-product_cat ul.products {
		grid-template-columns: 1fr !important;
	}
	.codentricks-shop-filter-bar {
		flex-direction: column !important;
		align-items: stretch !important;
		padding: 16px !important;
	}
	.codentricks-shop-search-form {
		max-width: 100% !important;
	}
	.codentricks-shop-categories-pills {
		justify-content: center !important;
	}
	.codentricks-shop-mfg-filter {
		justify-content: space-between !important;
	}
}

.archive.post-type-archive-product ul.products li.product,
.tax-product_cat ul.products li.product {
	background: transparent !important;
	border: none !important;
	box-shadow: none !important;
	padding: 0 !important;
	margin: 0 !important;
	list-style: none !important;
	width: auto !important;
	float: none !important;
}

/* Custom WhatsApp Card Layout */
.codentricks-wa-shop-card {
	display: flex !important;
	flex-direction: column !important;
	justify-content: space-between !important;
	background: #ffffff !important;
	border: 1px solid #ffe4e6 !important;
	border-radius: 20px !important;
	overflow: hidden !important;
	height: 100% !important;
	box-sizing: border-box !important;
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
	box-shadow: 0 4px 18px rgba(0,0,0,0.015) !important;
}

.codentricks-wa-shop-card:hover {
	transform: translateY(-6px) !important;
	box-shadow: 0 10px 25px rgba(239, 68, 68, 0.05) !important;
	border-color: #fbcfe8 !important;
}

.codentricks-wa-shop-card-image-wrap {
	position: relative !important;
	width: 100% !important;
	padding-top: 85% !important;
	background: #fafaf9 !important;
	overflow: hidden !important;
}

.codentricks-wa-shop-card-image-wrap img {
	position: absolute !important;
	top: 0 !important;
	left: 0 !important;
	width: 100% !important;
	height: 100% !important;
	object-fit: contain !important;
	padding: 20px !important;
	box-sizing: border-box !important;
	transition: transform 0.5s ease !important;
}

.codentricks-wa-shop-card:hover .codentricks-wa-shop-card-image-wrap img {
	transform: scale(1.05) !important;
}

.codentricks-wa-shop-card-brand-badge {
	position: absolute !important;
	top: 15px !important;
	left: 15px !important;
	font-family: 'Plus Jakarta Sans', sans-serif !important;
	font-size: 9px !important;
	font-weight: 800 !important;
	letter-spacing: 0.5px !important;
	color: #ffffff !important;
	padding: 5px 12px !important;
	border-radius: 6px !important;
	text-transform: uppercase !important;
	box-shadow: 0 4px 10px rgba(0,0,0,0.08) !important;
	display: inline-flex !important;
	align-items: center !important;
	gap: 4px !important;
}

.codentricks-wa-shop-card-brand-badge.badge-orange {
	background: linear-gradient(135deg, #f97316 0%, #ff5722 100%) !important;
}

.codentricks-wa-shop-card-brand-badge.badge-dark {
	background: #1e293b !important;
}

.codentricks-wa-shop-card-brand-badge .badge-tag-icon {
	font-size: 9px !important;
	margin-right: 2px !important;
}

.codentricks-wa-shop-card-body {
	padding: 24px !important;
	display: flex !important;
	flex-direction: column !important;
	flex-grow: 1 !important;
	box-sizing: border-box !important;
}

.codentricks-wa-shop-card-category {
	font-family: 'Plus Jakarta Sans', sans-serif !important;
	font-size: 10.5px !important;
	font-weight: 800 !important;
	color: #f97316 !important;
	letter-spacing: 1px !important;
	text-transform: uppercase !important;
	margin-bottom: 6px !important;
	display: block !important;
}

.codentricks-wa-shop-card-title {
	font-family: 'Plus Jakarta Sans', sans-serif !important;
	font-size: 18px !important;
	font-weight: 800 !important;
	color: #0f172a !important;
	line-height: 1.3 !important;
	margin: 0 0 10px 0 !important;
}

.codentricks-wa-shop-card-title a {
	color: inherit !important;
	text-decoration: none !important;
	transition: color 0.2s ease !important;
}

.codentricks-wa-shop-card-title a:hover {
	color: #f97316 !important;
}

.codentricks-wa-shop-card-excerpt {
	font-family: 'Inter', sans-serif !important;
	font-size: 13.5px !important;
	line-height: 1.6 !important;
	color: #64748b !important;
	margin: 0 0 16px 0 !important;
	display: -webkit-box !important;
	-webkit-line-clamp: 3 !important;
	-webkit-box-orient: vertical !important;
	overflow: hidden !important;
}

.codentricks-wa-shop-card-pills {
	display: flex !important;
	flex-direction: column !important;
	gap: 6px !important;
	margin-bottom: 20px !important;
}

.codentricks-wa-shop-card-pills .pill-badge {
	font-family: 'Inter', sans-serif !important;
	font-size: 11px !important;
	font-weight: 700 !important;
	padding: 6px 12px !important;
	border-radius: 6px !important;
	display: inline-block !important;
	width: fit-content !important;
}

.codentricks-wa-shop-card-pills .pill-moq {
	background: #ecfdf5 !important;
	color: #059669 !important;
}

.codentricks-wa-shop-card-pills .pill-pack {
	background: #fff7ed !important;
	color: #ea580c !important;
}

.codentricks-wa-shop-card-specs {
	display: flex !important;
	justify-content: space-between !important;
	align-items: center !important;
	border-top: 1px solid #f1f5f9 !important;
	padding-top: 14px !important;
	margin-top: auto !important;
	font-family: 'Inter', sans-serif !important;
	font-size: 12.5px !important;
	font-weight: 600 !important;
}

.codentricks-wa-shop-card-specs .specs-link {
	color: #64748b !important;
	text-decoration: none !important;
	display: flex !important;
	align-items: center !important;
	gap: 6px !important;
	transition: color 0.2s ease !important;
}

.codentricks-wa-shop-card-specs .specs-link:hover {
	color: #f97316 !important;
}

.codentricks-wa-shop-card-specs .info-circle-icon {
	color: #f97316 !important;
	font-weight: 700 !important;
	font-size: 14px !important;
}

.codentricks-wa-shop-card-specs .expand-btn {
	color: #ef4444 !important;
	text-transform: uppercase !important;
	text-decoration: none !important;
	letter-spacing: 0.5px !important;
	transition: color 0.2s ease !important;
}

.codentricks-wa-shop-card-specs .expand-btn:hover {
	color: #b91c1c !important;
}

.codentricks-wa-shop-card-actions {
	display: flex !important;
	gap: 10px !important;
	padding: 0 24px 24px 24px !important;
	box-sizing: border-box !important;
}

.codentricks-wa-shop-card-actions .actions-wa-btn {
	flex-grow: 1 !important;
	background: #00a884 !important;
	color: #ffffff !important;
	text-decoration: none !important;
	font-family: 'Plus Jakarta Sans', sans-serif !important;
	font-size: 12px !important;
	font-weight: 800 !important;
	letter-spacing: 0.5px !important;
	padding: 12px 20px !important;
	border-radius: 8px !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 8px !important;
	box-shadow: 0 4px 10px rgba(0, 168, 132, 0.15) !important;
	transition: all 0.3s ease !important;
}

.codentricks-wa-shop-card-actions .actions-wa-btn:hover {
	background: #008f70 !important;
	box-shadow: 0 6px 14px rgba(0, 168, 132, 0.25) !important;
}

.codentricks-wa-shop-card-actions .actions-arrow-btn {
	border: 1px solid #ffe4e6 !important;
	background: #ffffff !important;
	color: #ef4444 !important;
	font-size: 16px !important;
	font-weight: 700 !important;
	width: 44px !important;
	height: 44px !important;
	border-radius: 8px !important;
	text-decoration: none !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	transition: all 0.25s ease !important;
	box-sizing: border-box !important;
}

.codentricks-wa-shop-card-actions .actions-arrow-btn:hover {
	background: #fff5f5 !important;
	border-color: #ef4444 !important;
}

/* ==========================================================================
   8. CT  WHATSAPP FORM WIDGET
   ========================================================================== */
.codentricks-wa-form-container {
	display: flex !important;
	justify-content: center !important;
	align-items: center !important;
	width: 100% !important;
	box-sizing: border-box !important;
	background: transparent !important;
	padding: 20px 0 !important;
}

.codentricks-wa-form-card {
	position: relative !important;
	background: #ffffff !important;
	border-radius: 16px !important;
	padding: 40px !important;
	box-shadow: 0 10px 40px rgba(0, 0, 0, 0.04) !important;
	border: 1px solid rgba(0, 0, 0, 0.03) !important;
	box-sizing: border-box !important;
	width: 100% !important;
	max-width: 680px !important;
	overflow: hidden !important;
}

/* Red/Pink Top Bar Highlight */
.codentricks-wa-form-card::before {
	content: "" !important;
	position: absolute !important;
	top: 0 !important;
	left: 0 !important;
	right: 0 !important;
	height: 4px !important;
	background: linear-gradient(90deg, #ff9800 0%, #e91e63 100%) !important;
	z-index: 1 !important;
}

.codentricks-wa-form-header {
	margin-bottom: 24px !important;
	padding-bottom: 20px !important;
	border-bottom: 1px solid #f1f5f9 !important;
	text-align: left !important;
}

.codentricks-wa-form-title {
	font-family: 'Plus Jakarta Sans', sans-serif !important;
	font-size: 24px !important;
	font-weight: 800 !important;
	line-height: 1.25 !important;
	color: #111827 !important;
	margin: 0 0 8px 0 !important;
	letter-spacing: -0.5px !important;
}

.codentricks-wa-form-subtitle {
	font-family: 'Inter', sans-serif !important;
	font-size: 14px !important;
	line-height: 1.5 !important;
	color: #6b7280 !important;
	margin: 0 !important;
}

.codentricks-wa-callback-form {
	display: flex !important;
	flex-direction: column !important;
	width: 100% !important;
	box-sizing: border-box !important;
}

.required-asterisk {
	color: #ef4444 !important;
	margin-left: 2px !important;
	font-weight: bold !important;
}

/* Fields & Labels */
.wa-form-group {
	display: flex !important;
	flex-direction: column !important;
	gap: 8px !important;
	margin-bottom: 24px !important;
	width: 100% !important;
	box-sizing: border-box !important;
}

.wa-form-group label {
	font-family: 'Inter', sans-serif !important;
	font-size: 11px !important;
	font-weight: 800 !important;
	color: #1f2937 !important;
	letter-spacing: 0.5px !important;
	text-transform: uppercase !important;
	text-align: left !important;
}

.wa-form-control {
	background: #ffffff !important;
	border: 1px solid #e2e8f0 !important;
	border-radius: 8px !important;
	padding: 14px 18px !important;
	font-family: 'Inter', sans-serif !important;
	font-size: 14px !important;
	color: #1f2937 !important;
	box-sizing: border-box !important;
	width: 100% !important;
	min-width: 0 !important;
	max-width: 100% !important;
	transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.wa-form-control::placeholder {
	color: #9ca3af !important;
	opacity: 1 !important;
}

.wa-form-control:focus {
	outline: none !important;
	border-color: #e91e63 !important;
	background: #ffffff !important;
	box-shadow: 0 0 0 3px rgba(233, 30, 99, 0.12) !important;
}

/* Modern Constraint Validation styling */
.wa-form-control:user-invalid,
.wa-form-control.user-invalid-fallback {
	border-color: #ef4444 !important;
	background-color: #fef2f2 !important;
}

.error-msg {
	display: none !important;
	color: #ef4444 !important;
	font-family: 'Inter', sans-serif !important;
	font-size: 12px !important;
	font-weight: 600 !important;
	margin-top: 6px !important;
	text-align: left !important;
}

.wa-form-control:user-invalid + .error-msg,
.wa-form-control.user-invalid-fallback + .error-msg {
	display: block !important;
}

/* Submit Button */
.codentricks-wa-submit-btn {
	width: 100% !important;
	max-width: 100% !important;
	border: none !important;
	border-radius: 8px !important;
	padding: 16px 24px !important;
	font-family: 'Plus Jakarta Sans', sans-serif !important;
	font-size: 14px !important;
	font-weight: 800 !important;
	letter-spacing: 0.5px !important;
	color: #ffffff !important;
	background: linear-gradient(90deg, #ff9800 0%, #e91e63 100%) !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 10px !important;
	cursor: pointer !important;
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
	box-shadow: 0 4px 15px rgba(233, 30, 99, 0.2) !important;
	box-sizing: border-box !important;
}

.codentricks-wa-submit-btn:hover {
	transform: translateY(-2px) !important;
	box-shadow: 0 8px 24px rgba(233, 30, 99, 0.35) !important;
	filter: brightness(1.05) !important;
}

.codentricks-wa-submit-btn:active {
	transform: translateY(0) !important;
}

.wa-btn-svg {
	width: 18px !important;
	height: 18px !important;
	fill: currentColor !important;
	transition: transform 0.3s ease !important;
	flex-shrink: 0 !important;
}

.codentricks-wa-submit-btn:hover .wa-btn-svg {
	transform: scale(1.15) rotate(-8deg) !important;
}

/* Responsive styles */
@media (max-width: 768px) {
	.codentricks-wa-form-card {
		padding: 30px 24px !important;
		border-radius: 12px !important;
	}
	.codentricks-wa-form-title {
		font-size: 20px !important;
	}
	.codentricks-wa-form-subtitle {
		font-size: 13px !important;
	}
	.wa-form-control {
		padding: 12px 14px !important;
		font-size: 13px !important;
	}
	.codentricks-wa-submit-btn {
		padding: 14px 20px !important;
		font-size: 13px !important;
	}
}

/* ==========================================================================
   9. CT  CARD WIDGET
   ========================================================================== */
.codentricks-card-container {
	display: flex !important;
	flex-direction: row !important;
	align-items: flex-start !important;
	background: #ffffff;
	border: 1px solid #fee2e2;
	border-radius: 16px;
	padding: 30px 40px;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.015);
	gap: 20px !important;
	width: 100% !important;
	box-sizing: border-box !important;
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.codentricks-card-container:hover {
	transform: translateY(-2px);
	box-shadow: 0 10px 25px rgba(233, 30, 99, 0.05);
	border-color: rgba(233, 30, 99, 0.15) !important;
}

.codentricks-card-icon-column {
	flex-shrink: 0 !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
}

.codentricks-card-icon-wrapper {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 48px !important;
	height: 48px !important;
	border-radius: 50% !important;
	background-color: #fff1f2;
	color: #e91e63;
	border: 1px solid rgba(233, 30, 99, 0.05);
	transition: transform 0.3s ease !important;
}

.codentricks-card-container:hover .codentricks-card-icon-wrapper {
	transform: scale(1.05) rotate(-5deg);
}

.codentricks-card-content-column {
	flex-grow: 1 !important;
	display: flex !important;
	flex-direction: column !important;
	gap: 8px !important;
	text-align: left !important;
}

.codentricks-card-title {
	font-family: 'Plus Jakarta Sans', sans-serif !important;
	font-size: 16px !important;
	font-weight: 800 !important;
	color: #111827;
	text-transform: uppercase !important;
	margin: 0 !important;
	letter-spacing: 0.5px !important;
	line-height: 1.4 !important;
}

.codentricks-card-address {
	font-family: 'Inter', sans-serif !important;
	font-size: 14px !important;
	line-height: 1.65 !important;
	color: #4b5563;
}

.codentricks-card-address p {
	margin: 0 !important;
}

.codentricks-card-footer {
	font-family: 'Inter', sans-serif !important;
	font-size: 13px !important;
	line-height: 1.5 !important;
	color: #9ca3af;
	margin: 0 !important;
}

/* Responsive adjustments */
@media (max-width: 600px) {
	.codentricks-card-container {
		flex-direction: column !important;
		align-items: flex-start !important;
		padding: 24px 20px !important;
		gap: 16px !important;
	}
	.codentricks-card-icon-wrapper {
		width: 40px !important;
		height: 40px !important;
	}
	.codentricks-card-title {
		font-size: 14px !important;
	}
	.codentricks-card-address {
		font-size: 13px !important;
	}
	.codentricks-card-footer {
		font-size: 12px !important;
	}
}

/* ==========================================================================
   10. WOOCOMMERCE CATALOG SHOP BANNER
   ========================================================================== */
.codentricks-shop-banner {
	display: flex !important;
	justify-content: space-between !important;
	align-items: center !important;
	background: #ffffff;
	padding: 24px 0 32px 0 !important;
	margin-bottom: 24px !important;
	border-bottom: 1px solid rgba(239, 68, 68, 0.08) !important;
	gap: 30px !important;
	width: 100% !important;
	box-sizing: border-box !important;
}

.codentricks-shop-banner-main {
	display: flex !important;
	align-items: center !important;
	gap: 20px !important;
	flex-grow: 1 !important;
}

.codentricks-shop-banner-logo {
	flex-shrink: 0 !important;
	width: 64px !important;
	height: 64px !important;
	border-radius: 50% !important;
	overflow: hidden !important;
	border: 2px solid #fee2e2 !important;
}

.codentricks-shop-banner-logo img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
}

.codentricks-shop-banner-content {
	display: flex !important;
	flex-direction: column !important;
	align-items: flex-start !important;
	text-align: left !important;
}

.codentricks-shop-banner-tagline {
	font-family: 'Plus Jakarta Sans', sans-serif !important;
	font-size: 11px !important;
	font-weight: 800 !important;
	color: #f97316 !important; /* Premium orange tagline */
	letter-spacing: 1px !important;
	text-transform: uppercase !important;
	margin-bottom: 4px !important;
}

.codentricks-shop-banner-title {
	font-family: 'Plus Jakarta Sans', sans-serif !important;
	font-size: 32px !important;
	font-weight: 800 !important;
	color: #111827 !important;
	margin: 0 0 8px 0 !important;
	letter-spacing: -0.5px !important;
	line-height: 1.2 !important;
}

.codentricks-shop-banner-desc {
	font-family: 'Inter', sans-serif !important;
	font-size: 13.5px !important;
	line-height: 1.6 !important;
	color: #6b7280 !important;
	margin: 0 !important;
}

.codentricks-shop-banner-badge {
	flex-shrink: 0 !important;
	background: #fffbeb !important; /* Soft yellow card background */
	border: 1px solid #fde68a !important;
	border-radius: 12px !important;
	padding: 14px 20px !important;
	text-align: center !important;
	display: flex !important;
	flex-direction: column !important;
	justify-content: center !important;
	align-items: center !important;
	gap: 4px !important;
	box-shadow: 0 4px 12px rgba(253, 230, 138, 0.15) !important;
	box-sizing: border-box !important;
}

.codentricks-shop-banner-badge .badge-count {
	font-family: 'Plus Jakarta Sans', sans-serif !important;
	font-size: 16px !important;
	font-weight: 800 !important;
	color: #7c2d12 !important; /* Dark brown active line count */
	line-height: 1 !important;
}

.codentricks-shop-banner-badge .badge-label {
	font-family: 'Inter', sans-serif !important;
	font-size: 9px !important;
	font-weight: 800 !important;
	color: #d97706 !important; /* Orange label */
	letter-spacing: 0.5px !important;
	text-transform: uppercase !important;
	line-height: 1 !important;
}

/* Responsive banner settings */
@media (max-width: 768px) {
	.codentricks-shop-banner {
		flex-direction: column !important;
		align-items: flex-start !important;
		padding: 20px 0 24px 0 !important;
		gap: 20px !important;
	}
	.codentricks-shop-banner-main {
		width: 100% !important;
	}
	.codentricks-shop-banner-title {
		font-size: 26px !important;
	}
	.codentricks-shop-banner-desc {
		font-size: 13px !important;
	}
	.codentricks-shop-banner-badge {
		align-self: flex-start !important;
		padding: 10px 16px !important;
	}
}

/* Fallback override to hide Home / Products breadcrumbs */
.woocommerce-breadcrumb {
	display: none !important;
}

/* ==========================================================================
   11. CT  FULL SLIDER WIDGET
   ========================================================================== */
.codentricks-full-slider-wrapper {
	position: relative !important;
	width: 100% !important;
	overflow: hidden !important;
	box-sizing: border-box !important;
}

.codentricks-slider-container {
	position: relative !important;
	width: 100% !important;
	height: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
	overflow: hidden !important; /* Prevent any accidental overflow */
	box-sizing: border-box !important;
}

/* Slide Effect Layout */
.codentricks-full-slider-wrapper[data-effect="slide"] .codentricks-slider-container {
	display: flex !important;
	flex-flow: row nowrap !important;
	align-items: stretch !important; /* Force all slide items to stretch vertically */
	overflow-x: auto !important;
	overflow-y: hidden !important; /* Lock vertical scrolling of the container completely */
	scroll-snap-type: x mandatory !important;
	scroll-behavior: smooth !important;
	-webkit-overflow-scrolling: touch !important;
	scrollbar-width: none !important; /* Hide scrollbars Firefox */
}

.codentricks-full-slider-wrapper[data-effect="slide"] .codentricks-slider-container::-webkit-scrollbar {
	display: none !important; /* Hide scrollbars Chrome/Safari */
}

.codentricks-full-slider-wrapper[data-effect="slide"] .codentricks-slide-item {
	flex: 0 0 100% !important;
	width: 100% !important;
	height: 100% !important; /* Ensure height matches container perfectly */
	scroll-snap-align: start !important;
	scroll-snap-stop: always !important;
}

/* Fade Effect Layout */
.codentricks-full-slider-wrapper[data-effect="fade"] .codentricks-slider-container {
	position: relative !important;
}

.codentricks-full-slider-wrapper[data-effect="fade"] .codentricks-slide-item {
	position: absolute !important;
	top: 0 !important;
	left: 0 !important;
	width: 100% !important;
	height: 100% !important;
	opacity: 0 !important;
	z-index: 1 !important;
	transition: opacity 0.8s ease-in-out !important;
	pointer-events: none !important;
}

.codentricks-full-slider-wrapper[data-effect="fade"] .codentricks-slide-item.active {
	opacity: 1 !important;
	z-index: 2 !important;
	pointer-events: auto !important;
}

/* Slide Item Inner Layout */
.codentricks-slide-item {
	position: relative !important;
	height: 100% !important;
	background-size: cover !important;
	background-position: center !important;
	background-repeat: no-repeat !important;
	background-attachment: scroll !important; /* Force standard scroll layout to prevent fixed/parallax white space gaps */
	display: flex !important;
	align-items: flex-end !important; /* Align content to the bottom */
	box-sizing: border-box !important;
}

.codentricks-slide-overlay {
	position: absolute !important;
	top: 0 !important;
	left: 0 !important;
	right: 0 !important;
	bottom: 0 !important;
	z-index: 1 !important;
}

.codentricks-slide-content {
	position: relative !important;
	z-index: 2 !important;
	width: 100% !important;
	max-width: 1200px !important;
	margin: 0 auto !important;
	padding: 80px 4% !important;
	box-sizing: border-box !important;
}

/* Content Alignment options */
.codentricks-slide-content.container-align-left {
	text-align: left !important;
	margin-right: auto !important;
	max-width: 650px !important;
}

.codentricks-slide-content.container-align-center {
	text-align: center !important;
	margin-left: auto !important;
	margin-right: auto !important;
	max-width: 800px !important;
}

.codentricks-slide-content.container-align-right {
	text-align: right !important;
	margin-left: auto !important;
	max-width: 650px !important;
}

/* Keep slider content left-positioned on desktop without changing mobile layout. */
@media (min-width: 769px) {
	.codentricks-full-slider-wrapper .codentricks-slide-content {
		text-align: left !important;
		margin-left: max(0px, calc((100% - 1200px) / 2)) !important;
		margin-right: auto !important;
		max-width: 650px !important;
	}

	.codentricks-full-slider-wrapper .codentricks-slide-badge {
		margin-left: 0 !important;
		margin-right: 0 !important;
	}

	.codentricks-full-slider-wrapper .codentricks-slide-buttons {
		justify-content: flex-start !important;
	}
}

/* Alignment of Inner Elements inside Center Align */
.container-align-center .codentricks-slide-badge {
	margin-left: auto !important;
	margin-right: auto !important;
}

.container-align-center .codentricks-slide-buttons {
	justify-content: center !important;
}

/* Alignment of Inner Elements inside Right Align */
.container-align-right .codentricks-slide-badge {
	margin-left: auto !important;
}

.container-align-right .codentricks-slide-buttons {
	justify-content: flex-end !important;
}

/* Capsule badge */
.codentricks-slide-badge {
	display: inline-flex !important;
	align-items: center !important;
	gap: 6px !important;
	background: #f59e0b !important; /* Golden Orange capsule */
	color: #ffffff !important;
	font-family: 'Plus Jakarta Sans', sans-serif !important;
	font-size: 11.5px !important;
	font-weight: 800 !important;
	text-transform: uppercase !important;
	letter-spacing: 1px !important;
	padding: 8px 18px !important;
	border-radius: 30px !important;
	margin-bottom: 24px !important;
	box-shadow: 0 4px 12px rgba(245, 158, 11, 0.25) !important;
	width: fit-content !important;
}

.codentricks-slide-badge .badge-icon {
	font-size: 12px !important;
	display: flex !important;
	align-items: center !important;
}

/* Subheading text */
.codentricks-slide-subheading {
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-size: 13.5px;
	font-weight: 800;
	color: #fbbf24; /* Premium Gold/Yellow Subtitle */
	text-transform: uppercase;
	letter-spacing: 1px;
	margin: 0 0 16px 0;
	line-height: 1.4;
}

/* Main Heading Title */
.codentricks-slide-title {
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-size: 54px;
	font-weight: 800;
	color: #ffffff;
	line-height: 1.15;
	margin: 0 0 20px 0;
	letter-spacing: -1px;
}

/* Description text */
.codentricks-slide-desc {
	font-family: 'Inter', sans-serif;
	font-size: 16px;
	line-height: 1.7;
	color: rgba(255, 255, 255, 0.9);
	margin: 0 0 36px 0;
}

/* Button wrapper */
.codentricks-slide-buttons {
	display: flex !important;
	flex-wrap: wrap !important;
	align-items: center !important;
	gap: 16px !important;
}

/* Primary Button (Explore Wholesale Catalog) */
.codentricks-btn-explore {
	background: linear-gradient(90deg, #f97316 0%, #db2777 100%) !important; /* Premium Pink-Orange gradient */
	color: #ffffff !important;
	font-family: 'Plus Jakarta Sans', sans-serif !important;
	font-size: 12.5px !important;
	font-weight: 800 !important;
	letter-spacing: 0.5px !important;
	text-transform: uppercase !important;
	padding: 16px 30px !important;
	border-radius: 10px !important;
	text-decoration: none !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 8px !important;
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
	box-shadow: 0 4px 15px rgba(219, 39, 119, 0.3) !important;
	cursor: pointer !important;
}

.codentricks-btn-explore:hover {
	transform: translateY(-2px) !important;
	box-shadow: 0 8px 22px rgba(219, 39, 119, 0.45) !important;
	filter: brightness(1.08) !important;
}

.codentricks-btn-explore .btn-arrow {
	font-size: 15px !important;
	transition: transform 0.3s ease !important;
	display: inline-block !important;
}

.codentricks-btn-explore:hover .btn-arrow {
	transform: translateX(4px) !important;
}

/* Secondary Button (WhatsApp Chat) */
.codentricks-btn-whatsapp {
	background: rgba(255, 255, 255, 0.08) !important;
	border: 1px solid rgba(255, 255, 255, 0.2) !important;
	backdrop-filter: blur(8px) !important;
	-webkit-backdrop-filter: blur(8px) !important;
	color: #ffffff !important;
	font-family: 'Plus Jakarta Sans', sans-serif !important;
	font-size: 12.5px !important;
	font-weight: 800 !important;
	letter-spacing: 0.5px !important;
	text-transform: uppercase !important;
	padding: 16px 30px !important;
	border-radius: 10px !important;
	text-decoration: none !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 8px !important;
	transition: all 0.3s ease !important;
	cursor: pointer !important;
}

.codentricks-btn-whatsapp:hover {
	background: rgba(255, 255, 255, 0.15) !important;
	border-color: rgba(255, 255, 255, 0.4) !important;
	transform: translateY(-2px) !important;
}

.codentricks-btn-whatsapp .wa-icon {
	color: #22c55e !important; /* WhatsApp Green icon */
	display: inline-flex !important;
	align-items: center !important;
}

.codentricks-btn-whatsapp .wa-icon svg {
	fill: currentColor !important;
}

/* Navigation Arrow Controls */
.codentricks-slider-arrow {
	position: absolute !important;
	top: 50% !important;
	transform: translateY(-50%) !important;
	z-index: 10 !important;
	width: 52px !important;
	height: 52px !important;
	border-radius: 50% !important;
	border: none !important;
	background: rgba(255, 255, 255, 0.08) !important;
	backdrop-filter: blur(10px) !important;
	-webkit-backdrop-filter: blur(10px) !important;
	color: #ffffff !important;
	cursor: pointer !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
	padding: 0 !important;
	box-shadow: 0 4px 12px rgba(0,0,0,0.1) !important;
}

.codentricks-slider-arrow:hover {
	background: rgba(255, 255, 255, 0.22) !important;
	transform: translateY(-50%) scale(1.05) !important;
}

.codentricks-slider-arrow.arrow-prev {
	left: 30px !important;
}

.codentricks-slider-arrow.arrow-next {
	right: 30px !important;
}

.codentricks-slider-arrow svg {
	width: 12px !important;
	height: 24px !important;
	fill: currentColor !important;
}

/* Dot Navigation Pagination */
.codentricks-slider-dots {
	position: absolute !important;
	bottom: 35px !important;
	left: 50% !important;
	transform: translateX(-50%) !important;
	display: flex !important;
	gap: 12px !important;
	z-index: 10 !important;
}

.slider-dot {
	width: 8px !important;
	height: 8px !important;
	border-radius: 50% !important;
	background: rgba(255, 255, 255, 0.4) !important;
	cursor: pointer !important;
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.slider-dot:hover {
	background: rgba(255, 255, 255, 0.7) !important;
}

.slider-dot.active {
	width: 24px !important; /* Active dot stretches into a pill shape */
	border-radius: 4px !important;
	background: #f59e0b !important; /* Active dot is golden orange */
	box-shadow: 0 0 8px rgba(245, 158, 11, 0.6) !important;
}

/* Responsive Mobile Layout (<= 768px) */
@media (max-width: 768px) {
	.codentricks-slide-content {
		padding: 50px 24px !important;
	}

	.codentricks-slide-badge {
		padding: 6px 14px !important;
		font-size: 10px !important;
		margin-bottom: 16px !important;
	}

	.codentricks-slide-subheading {
		font-size: 11px;
		margin-bottom: 12px;
	}

	.codentricks-slide-title {
		font-size: 32px; /* Responsive typography scale down */
		margin-bottom: 16px;
	}

	.codentricks-slide-desc {
		font-size: 14px;
		line-height: 1.6;
		margin-bottom: 24px;
	}

	.codentricks-slide-buttons {
		flex-direction: column !important; /* Buttons stack vertically */
		align-items: stretch !important;
		gap: 12px !important;
		width: 100% !important;
	}

	.codentricks-btn-explore,
	.codentricks-btn-whatsapp {
		width: 100% !important; /* Buttons expand to full width of stacked container */
		padding: 14px 20px !important;
		font-size: 12px !important;
		justify-content: center !important;
	}

	.codentricks-slider-arrow {
		width: 42px !important;
		height: 42px !important;
	}

	.codentricks-slider-arrow.arrow-prev {
		left: 10px !important;
	}

	.codentricks-slider-arrow.arrow-next {
		right: 10px !important;
	}

	.codentricks-slider-dots {
		bottom: 20px !important;
		gap: 8px !important;
	}

	.slider-dot {
		width: 6px !important;
		height: 6px !important;
	}

	.slider-dot.active {
		width: 18px !important;
	}
}

/* ==========================================================================
   12. BHOG SLIDER WIDGET
   ========================================================================== */
.elementor-widget-bhog-slider {
	width: 100vw !important;
	max-width: 100vw !important;
	margin-inline-start: calc(50% - 50vw) !important;
	margin-bottom: 0 !important;
}

.bhog-slider {
	--bhog-accent: #d4ae30;
	--bhog-slider-height: clamp(560px, min(78vh, 760px), 760px);
	position: relative;
	display: block;
	width: 100%;
	height: var(--bhog-slider-height);
	min-height: var(--bhog-slider-height);
	overflow: hidden;
	background: #0b0b0b;
	color: #fff;
	font-family: 'Poppins', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

.bhog-slider__track,
.bhog-slider__slide {
	position: relative;
	width: 100%;
	height: 100%;
	min-height: 100%;
}

.bhog-slider__slide {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: stretch;
	opacity: 0;
	visibility: hidden;
	z-index: 0;
	transition: opacity 620ms ease, visibility 0s linear 620ms;
}

.bhog-slider__slide.is-active {
	position: relative;
	opacity: 1;
	visibility: visible;
	z-index: 1;
	transition: opacity 620ms ease;
}

.bhog-slider__visual {
	position: absolute;
	inset: 0;
	background-color: #151515;
	background-image: var(--bhog-slider-image);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
}

.bhog-slider__visual::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, rgba(8, 8, 8, .94) 0%, rgba(8, 8, 8, .78) 28%, rgba(8, 8, 8, .26) 58%, rgba(8, 8, 8, .05) 100%), linear-gradient(0deg, rgba(8, 8, 8, .5), transparent 35%);
}

.bhog-slider__inner {
	position: relative;
	z-index: 1;
	display: flex;
	align-items: center;
	width: 100%;
	max-width: 1200px;
	margin-inline: auto;
	padding-inline: 24px;
}

.bhog-slider__content {
	width: min(100%, 560px);
	padding-block: 48px;
	text-align: left;
}

.bhog-slider__eyebrow {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 0 0 18px;
	color: rgba(255, 255, 255, .66);
	font-size: clamp(.62rem, .68vw, .74rem);
	font-weight: 600;
	letter-spacing: .34em;
	line-height: 1.5;
	text-transform: uppercase;
}

.bhog-slider__eyebrow::before {
	content: '//';
	color: rgba(255, 255, 255, .8);
	font-weight: 700;
	letter-spacing: .16em;
}

.bhog-slider h2 {
	max-width: 14ch;
	margin: 0 0 16px;
	color: #fff;
	font-family: 'Poppins', 'Inter', sans-serif;
	font-size: clamp(2.2rem, 3.5vw, 4rem);
	font-weight: 700;
	letter-spacing: -.045em;
	line-height: .98;
	text-transform: uppercase;
}

.bhog-slider h2 em {
	color: var(--bhog-accent);
	font-family: Georgia, 'Times New Roman', serif;
	font-size: 1.02em;
	font-style: italic;
	font-weight: 400;
	letter-spacing: -.06em;
	text-transform: none;
}

.bhog-slider__text {
	max-width: 52ch;
	margin: 0 0 28px;
	color: rgba(255, 255, 255, .64);
	font-size: .79rem;
	line-height: 1.65;
}

.bhog-slider__button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 175px;
	min-height: 52px;
	padding: 15px 28px;
	background: #fff;
	color: #101010;
	font-size: .68rem;
	font-weight: 700;
	letter-spacing: .22em;
	line-height: 1.2;
	text-decoration: none !important;
	text-transform: uppercase;
	transition: background 220ms ease, color 220ms ease, transform 180ms ease;
}

.bhog-slider__button:hover,
.bhog-slider__button:focus-visible {
	background: var(--bhog-accent);
	color: #101010;
	transform: translateY(-2px);
}

.bhog-slider__arrow {
	position: absolute;
	top: 50%;
	z-index: 3;
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	border: 1px solid rgba(255, 255, 255, .4);
	border-radius: 50%;
	background: rgba(0, 0, 0, .16);
	color: #fff;
	cursor: pointer;
	opacity: 0;
	font-size: 30px;
	font-weight: 300;
	line-height: 1;
	transform: translateY(-50%);
	transition: opacity 220ms ease, background 180ms ease;
}

.bhog-slider:hover .bhog-slider__arrow,
.bhog-slider__arrow:focus-visible {
	opacity: 1;
}

.bhog-slider__arrow:hover {
	background: rgba(0, 0, 0, .5);
}

.bhog-slider__arrow--prev { left: 24px; }
.bhog-slider__arrow--next { right: 24px; }

.bhog-slider__dots {
	position: absolute;
	left: max(24px, calc((100% - 1200px) / 2 + 24px));
	bottom: 24px;
	z-index: 3;
	display: flex;
	align-items: center;
	gap: 10px;
}

.bhog-slider__dot {
	width: 7px;
	height: 7px;
	padding: 0;
	border: 0;
	border-radius: 999px;
	background: rgba(255, 255, 255, .7);
	cursor: pointer;
	transition: width 220ms ease, background 220ms ease;
}

.bhog-slider__dot.is-active {
	width: 42px;
	background: var(--bhog-accent);
}

@media (max-width: 768px) {
	.elementor-widget-bhog-slider {
		width: 100% !important;
		max-width: 100% !important;
		margin-inline-start: 0 !important;
	}

	.bhog-slider {
		height: auto;
		min-height: 0;
	}

	.bhog-slider__track {
		height: auto;
		min-height: 0;
	}

	.bhog-slider__slide {
		display: block;
		height: auto;
		min-height: 0;
	}

	.bhog-slider__slide.is-active {
		position: relative;
	}

	.bhog-slider__visual {
		position: relative;
		inset: auto;
		width: 100%;
		height: clamp(240px, 70vw, 380px);
		background-image: var(--bhog-slider-mobile-image);
		background-position: center top;
	}

	.bhog-slider__visual::after {
		background: linear-gradient(0deg, #0b0b0b 0%, rgba(11, 11, 11, .72) 13%, rgba(11, 11, 11, 0) 48%);
	}

	.bhog-slider__inner {
		display: block;
		max-width: none;
		padding: 0 16px 80px;
		background: #0b0b0b;
	}

	.bhog-slider__content {
		width: 100%;
		max-width: none;
		padding: 0;
	}

	.bhog-slider__eyebrow {
		margin-bottom: 14px;
		font-size: .62rem;
		letter-spacing: .28em;
	}

	.bhog-slider h2 {
		max-width: 17ch;
		margin-bottom: 14px;
		font-size: clamp(2rem, 8.3vw, 2.7rem);
		line-height: 1;
	}

	.bhog-slider__text {
		max-width: 38ch;
		margin-bottom: 24px;
		font-size: .78rem;
	}

	.bhog-slider__button {
		width: 100%;
		min-height: 49px;
	}

	.bhog-slider__arrow {
		display: none;
	}

	.bhog-slider__dots {
		left: 16px;
		bottom: 24px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.bhog-slider__slide,
	.bhog-slider__button,
	.bhog-slider__dot {
		transition: none;
	}
}

/* ===========================================================================
   13. WOOSTIFY CART SIDEBAR PRODUCT ROW FIX
   ========================================================================== */
#shop-cart-sidebar .cart-sidebar-content .woocommerce-mini-cart-item {
	position: relative !important;
	display: block !important;
	min-height: 95px !important;
	padding: 10px 30px 10px 90px !important;
	box-sizing: border-box !important;
}

#shop-cart-sidebar .cart-sidebar-content .woocommerce-mini-cart-item > a:not(.remove_from_cart_button) {
	display: block !important;
	min-height: 60px !important;
	margin: 0 !important;
	padding: 0 !important;
	line-height: 1.4 !important;
}

#shop-cart-sidebar .cart-sidebar-content .woocommerce-mini-cart-item > a:not(.remove_from_cart_button) img,
#shop-cart-sidebar .cart-sidebar-content .woocommerce-mini-cart-item > img {
	position: absolute !important;
	top: 10px !important;
	left: 15px !important;
	display: block !important;
	width: 60px !important;
	height: 60px !important;
	max-width: 60px !important;
	max-height: 60px !important;
	margin: 0 !important;
	float: none !important;
	object-fit: cover !important;
}

#shop-cart-sidebar .cart-sidebar-content .woocommerce-mini-cart-item .mini-cart-product-infor {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: 8px !important;
	width: 100% !important;
	margin-top: 10px !important;
}

@media (max-width: 599px) {
	#shop-cart-sidebar .cart-sidebar-content .woocommerce-mini-cart-item {
		padding-left: 85px !important;
	}
}

/* ===========================================================================
   14. WOOSTIFY CART SIDEBAR ACTION BUTTONS
   ========================================================================== */
#shop-cart-sidebar .cart-sidebar-content .woocommerce-mini-cart__buttons {
	display: grid !important;
	grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	gap: 10px !important;
	margin: 20px 0 0 !important;
}

#shop-cart-sidebar .cart-sidebar-content .woocommerce-mini-cart__buttons a.button {
	position: relative !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 100% !important;
	min-height: 50px !important;
	padding: 14px 16px !important;
	overflow: hidden !important;
	border: 1px solid transparent !important;
	border-radius: 12px !important;
	font-family: 'Plus Jakarta Sans', sans-serif !important;
	font-size: 11px !important;
	font-weight: 800 !important;
	letter-spacing: .08em !important;
	line-height: 1.2 !important;
	text-align: center !important;
	text-transform: uppercase !important;
	text-decoration: none !important;
	transform: translateY(0);
	transition: transform .25s ease, box-shadow .25s ease, background .25s ease, border-color .25s ease !important;
}

#shop-cart-sidebar .cart-sidebar-content .woocommerce-mini-cart__buttons a.button::before {
	position: absolute;
	top: 0;
	bottom: 0;
	left: -80%;
	width: 45%;
	content: '';
	background: linear-gradient(105deg, transparent, rgba(255, 255, 255, .55), transparent);
	transform: skewX(-18deg);
	transition: left .55s ease;
}

#shop-cart-sidebar .cart-sidebar-content .woocommerce-mini-cart__buttons a.button::after {
	content: '→';
	display: inline-block !important;
	margin-left: 8px;
	font-size: 16px;
	line-height: 1;
	transform: translateX(0);
	transition: transform .25s ease;
}

#shop-cart-sidebar .cart-sidebar-content .woocommerce-mini-cart__buttons a.button:hover,
#shop-cart-sidebar .cart-sidebar-content .woocommerce-mini-cart__buttons a.button:focus-visible {
	transform: translateY(-3px) !important;
	outline: none !important;
}

#shop-cart-sidebar .cart-sidebar-content .woocommerce-mini-cart__buttons a.button:hover::before,
#shop-cart-sidebar .cart-sidebar-content .woocommerce-mini-cart__buttons a.button:focus-visible::before {
	left: 135%;
}

#shop-cart-sidebar .cart-sidebar-content .woocommerce-mini-cart__buttons a.button:hover::after,
#shop-cart-sidebar .cart-sidebar-content .woocommerce-mini-cart__buttons a.button:focus-visible::after {
	transform: translateX(4px);
}

#shop-cart-sidebar .cart-sidebar-content .woocommerce-mini-cart__buttons a.button:not(.checkout) {
	border-color: rgba(255, 63, 113, .25) !important;
	background: linear-gradient(135deg, #ff3f71, #ff6b94) !important;
	box-shadow: 0 8px 18px rgba(255, 63, 113, .22) !important;
	color: #fff !important;
}

#shop-cart-sidebar .cart-sidebar-content .woocommerce-mini-cart__buttons a.button:not(.checkout):hover,
#shop-cart-sidebar .cart-sidebar-content .woocommerce-mini-cart__buttons a.button:not(.checkout):focus-visible {
	background: linear-gradient(135deg, #ff2c65, #ff4f84) !important;
	box-shadow: 0 12px 24px rgba(255, 63, 113, .32) !important;
}

#shop-cart-sidebar .cart-sidebar-content .woocommerce-mini-cart__buttons a.button.checkout {
	border-color: #252b39 !important;
	background: linear-gradient(135deg, #252b39, #343b4c) !important;
	box-shadow: 0 8px 18px rgba(37, 43, 57, .2) !important;
	color: #fff !important;
}

#shop-cart-sidebar .cart-sidebar-content .woocommerce-mini-cart__buttons a.button.checkout:hover,
#shop-cart-sidebar .cart-sidebar-content .woocommerce-mini-cart__buttons a.button.checkout:focus-visible {
	background: linear-gradient(135deg, #171c28, #293143) !important;
	box-shadow: 0 12px 24px rgba(37, 43, 57, .3) !important;
}

@media (max-width: 360px) {
	#shop-cart-sidebar .cart-sidebar-content .woocommerce-mini-cart__buttons {
		grid-template-columns: 1fr !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	#shop-cart-sidebar .cart-sidebar-content .woocommerce-mini-cart__buttons a.button,
	#shop-cart-sidebar .cart-sidebar-content .woocommerce-mini-cart__buttons a.button::before,
	#shop-cart-sidebar .cart-sidebar-content .woocommerce-mini-cart__buttons a.button::after {
		transition: none !important;
	}
}

/* Hide WooCommerce's generated View cart link on the single-product form. */
.single-product form.cart .added_to_cart {
	display: none !important;
	visibility: hidden !important;
}

/* ===========================================================================
   15. CODENTFLOW CART DRAWER OVERRIDES
   ========================================================================== */
#cf-cart-drawer .cf-drawer-content .woocommerce-mini-cart-item {
	position: relative !important;
	min-height: 95px !important;
	padding: 10px 30px 10px 85px !important;
	box-sizing: border-box !important;
}

#cf-cart-drawer .cf-drawer-content .woocommerce-mini-cart-item > a:not(.remove_from_cart_button) {
	display: block !important;
	min-height: 60px !important;
	margin: 0 !important;
	padding: 0 !important;
	line-height: 1.4 !important;
}

#cf-cart-drawer .cf-drawer-content .woocommerce-mini-cart-item > a:not(.remove_from_cart_button) img,
#cf-cart-drawer .cf-drawer-content .woocommerce-mini-cart-item > img {
	position: absolute !important;
	top: 10px !important;
	left: 0 !important;
	width: 60px !important;
	height: 60px !important;
	max-width: 60px !important;
	max-height: 60px !important;
	margin: 0 !important;
	object-fit: cover !important;
}

#cf-cart-drawer .cf-drawer-content .woocommerce-mini-cart__buttons {
	display: grid !important;
	grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	gap: 10px !important;
	margin: 20px 0 0 !important;
}

#cf-cart-drawer .cf-drawer-content .woocommerce-mini-cart__buttons a.button {
	position: relative !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 100% !important;
	min-height: 50px !important;
	padding: 14px 16px !important;
	overflow: hidden !important;
	border: 1px solid transparent !important;
	border-radius: 12px !important;
	font-family: 'Plus Jakarta Sans', sans-serif !important;
	font-size: 11px !important;
	font-weight: 800 !important;
	letter-spacing: .08em !important;
	line-height: 1.2 !important;
	text-align: center !important;
	text-transform: uppercase !important;
	text-decoration: none !important;
	transform: translateY(0);
	transition: transform .25s ease, box-shadow .25s ease, background .25s ease !important;
}

#cf-cart-drawer .cf-drawer-content .woocommerce-mini-cart__buttons a.button::before {
	position: absolute;
	top: 0;
	bottom: 0;
	left: -80%;
	width: 45%;
	content: '';
	background: linear-gradient(105deg, transparent, rgba(255, 255, 255, .55), transparent);
	transform: skewX(-18deg);
	transition: left .55s ease;
}

#cf-cart-drawer .cf-drawer-content .woocommerce-mini-cart__buttons a.button::after {
	content: '→';
	display: inline-block !important;
	margin-left: 8px;
	font-size: 16px;
	line-height: 1;
	transition: transform .25s ease;
}

#cf-cart-drawer .cf-drawer-content .woocommerce-mini-cart__buttons a.button:hover,
#cf-cart-drawer .cf-drawer-content .woocommerce-mini-cart__buttons a.button:focus-visible {
	transform: translateY(-3px) !important;
	outline: none !important;
}

#cf-cart-drawer .cf-drawer-content .woocommerce-mini-cart__buttons a.button:hover::before,
#cf-cart-drawer .cf-drawer-content .woocommerce-mini-cart__buttons a.button:focus-visible::before {
	left: 135%;
}

#cf-cart-drawer .cf-drawer-content .woocommerce-mini-cart__buttons a.button:hover::after,
#cf-cart-drawer .cf-drawer-content .woocommerce-mini-cart__buttons a.button:focus-visible::after {
	transform: translateX(4px);
}

#cf-cart-drawer .cf-drawer-content .woocommerce-mini-cart__buttons a.button:not(.checkout) {
	border-color: rgba(255, 63, 113, .25) !important;
	background: linear-gradient(135deg, #ff3f71, #ff6b94) !important;
	box-shadow: 0 8px 18px rgba(255, 63, 113, .22) !important;
	color: #fff !important;
}

#cf-cart-drawer .cf-drawer-content .woocommerce-mini-cart__buttons a.button.checkout {
	border-color: #252b39 !important;
	background: linear-gradient(135deg, #252b39, #343b4c) !important;
	box-shadow: 0 8px 18px rgba(37, 43, 57, .2) !important;
	color: #fff !important;
}

#cf-cart-drawer .cf-drawer-content .woocommerce-mini-cart__buttons a.button:not(.checkout):hover,
#cf-cart-drawer .cf-drawer-content .woocommerce-mini-cart__buttons a.button:not(.checkout):focus-visible {
	background: linear-gradient(135deg, #ff2c65, #ff4f84) !important;
	box-shadow: 0 12px 24px rgba(255, 63, 113, .32) !important;
}

#cf-cart-drawer .cf-drawer-content .woocommerce-mini-cart__buttons a.button.checkout:hover,
#cf-cart-drawer .cf-drawer-content .woocommerce-mini-cart__buttons a.button.checkout:focus-visible {
	background: linear-gradient(135deg, #171c28, #293143) !important;
	box-shadow: 0 12px 24px rgba(37, 43, 57, .3) !important;
}

@media (max-width: 360px) {
	#cf-cart-drawer .cf-drawer-content .woocommerce-mini-cart__buttons {
		grid-template-columns: 1fr !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	#cf-cart-drawer .cf-drawer-content .woocommerce-mini-cart__buttons a.button,
	#cf-cart-drawer .cf-drawer-content .woocommerce-mini-cart__buttons a.button::before,
	#cf-cart-drawer .cf-drawer-content .woocommerce-mini-cart__buttons a.button::after {
		transition: none !important;
	}
}

/* ===========================================================================
   16. CODENTFLOW PRODUCT ATTRIBUTE PRESENTATION
   ========================================================================== */
.single-product .cf-single-options {
	position: relative;
	margin: 1.25rem 0 1.5rem !important;
	padding: 1.35rem !important;
	border: 1px solid rgba(157, 67, 92, .14) !important;
	border-radius: 20px !important;
	background: linear-gradient(145deg, #fffaf8 0%, #fff 62%, #fff6f8 100%) !important;
	box-shadow: 0 12px 30px rgba(92, 45, 54, .08) !important;
}

.single-product .cf-single-options::before {
	position: absolute;
	top: 0;
	left: 1.35rem;
	width: 56px;
	height: 3px;
	border-radius: 0 0 5px 5px;
	content: '';
	background: linear-gradient(90deg, #ff3f71, #d8a85d);
}

.single-product .cf-single-options h3 {
	display: flex;
	align-items: center;
	gap: .5rem;
	margin: 0 0 .8rem !important;
	color: #252b38 !important;
	font-family: 'Plus Jakarta Sans', Inter, sans-serif !important;
	font-size: .68rem !important;
	font-weight: 800 !important;
	letter-spacing: .14em !important;
	line-height: 1.3 !important;
	text-transform: uppercase;
}

.single-product .cf-single-options h3::after {
	width: 28px;
	height: 1px;
	content: '';
	background: #d9b276;
}

.single-product .cf-colour-swatches {
	display: flex !important;
	flex-wrap: wrap;
	gap: 11px !important;
	margin: 0 0 1.35rem !important;
}

.single-product .cf-colour-swatch {
	position: relative;
	width: 68px !important;
	height: 84px !important;
	min-height: 0 !important;
	padding: 3px !important;
	overflow: hidden;
	border: 1px solid rgba(37, 43, 56, .12) !important;
	border-radius: 12px !important;
	background: #f3e9e5 !important;
	box-shadow: 0 3px 10px rgba(37, 43, 56, .08) !important;
	cursor: pointer;
	transform: translateY(0);
	transition: transform .28s cubic-bezier(.2, .8, .2, 1), border-color .28s ease, box-shadow .28s ease !important;
}

.single-product .cf-colour-swatch::after {
	position: absolute;
	right: 6px;
	bottom: 6px;
	display: grid;
	width: 19px;
	height: 19px;
	place-items: center;
	border: 2px solid #fff;
	border-radius: 50%;
	content: '✓';
	background: #ff3f71;
	color: #fff;
	font-size: 10px;
	font-weight: 800;
	line-height: 1;
	opacity: 0;
	box-shadow: 0 3px 8px rgba(72, 24, 38, .25);
	transform: scale(.5);
	transition: opacity .2s ease, transform .2s ease !important;
}

.single-product .cf-colour-swatch img {
	display: block;
	width: 100% !important;
	height: 100% !important;
	border-radius: 8px;
	object-fit: cover;
	transition: transform .45s cubic-bezier(.2, .8, .2, 1), filter .28s ease;
}

.single-product .cf-colour-swatch:hover,
.single-product .cf-colour-swatch:focus-visible {
	border-color: #ff3f71 !important;
	box-shadow: 0 10px 20px rgba(255, 63, 113, .2) !important;
	outline: none;
	transform: translateY(-5px) !important;
}

.single-product .cf-colour-swatch:hover img,
.single-product .cf-colour-swatch:focus-visible img {
	filter: saturate(1.08);
	transform: scale(1.07);
}

.single-product .cf-colour-swatch.is-selected {
	border: 2px solid #ff3f71 !important;
	box-shadow: 0 0 0 3px rgba(255, 63, 113, .13), 0 10px 20px rgba(255, 63, 113, .18) !important;
	transform: translateY(-2px) !important;
}

.single-product .cf-colour-swatch.is-selected::after {
	opacity: 1;
	transform: scale(1);
}

.single-product .cf-size-choice {
	position: relative;
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	gap: .45rem;
	min-height: 45px !important;
	margin: 0 !important;
	padding: .7rem 1.15rem !important;
	border: 1px solid #ff3f71 !important;
	border-radius: 999px !important;
	background: #fff !important;
	color: #ff3f71 !important;
	font-family: 'Plus Jakarta Sans', Inter, sans-serif !important;
	font-size: .72rem !important;
	font-weight: 800 !important;
	box-shadow: 0 4px 12px rgba(255, 63, 113, .08) !important;
	cursor: pointer;
	transition: color .25s ease, background .25s ease, box-shadow .25s ease, transform .25s ease !important;
}

.single-product .cf-size-choice::after {
	content: '✓';
	font-size: .78rem;
	opacity: .85;
}

.single-product .cf-size-choice:hover,
.single-product .cf-size-choice:focus-visible {
	background: linear-gradient(135deg, #ff3f71, #ff6d96) !important;
	box-shadow: 0 9px 18px rgba(255, 63, 113, .22) !important;
	color: #fff !important;
	outline: none;
	transform: translateY(-3px) !important;
}

.single-product .cf-tax-note {
	display: inline-flex !important;
	align-items: center;
	gap: .4rem;
	margin: 1rem 0 0 !important;
	padding: .42rem .7rem;
	border: 1px solid rgba(0, 168, 135, .16);
	border-radius: 999px;
	background: #effcf8;
	color: #008f77 !important;
	font-size: .67rem !important;
	font-weight: 800 !important;
	letter-spacing: .01em;
}

.single-product .cf-tax-note::before {
	content: '✓';
	font-size: .75rem;
}

@media (max-width: 520px) {
	.single-product .cf-single-options {
		padding: 1.1rem !important;
		border-radius: 16px !important;
	}

	.single-product .cf-single-options::before {
		left: 1.1rem;
	}

	.single-product .cf-colour-swatch {
		width: 61px !important;
		height: 76px !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	.single-product .cf-colour-swatch,
	.single-product .cf-colour-swatch::after,
	.single-product .cf-colour-swatch img,
	.single-product .cf-size-choice {
		transition: none !important;
	}

	.single-product .cf-colour-swatch:hover,
	.single-product .cf-colour-swatch:focus-visible,
	.single-product .cf-size-choice:hover,
	.single-product .cf-size-choice:focus-visible {
		transform: none !important;
	}
}

/* ===========================================================================
   10. CT  SERVICES WIDGET
   ========================================================================== */
.codentricks-services-container {
	position: relative;
	width: 100%;
}

.codentricks-services-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 24px;
	width: 100%;
}

/* Column 1: Intro Block styling */
.codentricks-services-intro {
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: flex-start;
	padding: 20px 10px;
}

.codentricks-services-intro-subtitle {
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-size: 11px;
	font-weight: 800;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	color: #c2f82c;
	margin-bottom: 18px;
	display: inline-block;
}

.codentricks-services-intro-title {
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-size: 38px;
	font-weight: 800;
	line-height: 1.25;
	color: #ffffff;
	margin: 0 0 32px 0;
	letter-spacing: -0.5px;
}

.codentricks-services-intro-btn {
	display: inline-flex;
	align-items: center;
	gap: 16px;
	text-decoration: none !important;
	padding: 8px 10px 8px 24px;
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-size: 14px;
	font-weight: 700;
	color: #09090b;
	background-color: #c2f82c;
	border-radius: 50px;
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	cursor: pointer;
}

.codentricks-services-intro-btn:hover {
	background-color: #ffffff;
	color: #09090b;
}

.codentricks-services-intro-btn .intro-btn-icon-wrapper {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border-radius: 50%;
	background-color: #09090b;
	transition: all 0.3s ease;
}

.codentricks-services-intro-btn .intro-btn-icon-wrapper i {
	color: #c2f82c;
	font-size: 12px;
	transform: rotate(-45deg);
	transition: transform 0.3s ease, color 0.3s ease;
}

.codentricks-services-intro-btn .intro-btn-icon-wrapper svg {
	fill: #c2f82c;
	width: 12px;
	height: 12px;
	transform: rotate(-45deg);
	transition: transform 0.3s ease, fill 0.3s ease;
}

.codentricks-services-intro-btn:hover .intro-btn-icon-wrapper {
	background-color: #09090b;
}

.codentricks-services-intro-btn:hover .intro-btn-icon-wrapper i {
	color: #ffffff;
	transform: rotate(0deg);
}

.codentricks-services-intro-btn:hover .intro-btn-icon-wrapper svg {
	fill: #ffffff;
	transform: rotate(0deg);
}

/* Service Cards styling */
.codentricks-service-card {
	background-color: #121212;
	border: 1px solid #222222;
	border-radius: 16px;
	padding: 32px;
	display: flex;
	flex-direction: column;
	height: 100%;
	box-sizing: border-box;
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.codentricks-service-card:hover {
	transform: translateY(-6px);
	border-color: #333333;
	box-shadow: 0 12px 30px rgba(0, 0, 0, 0.5);
}

.codentricks-service-card-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 28px;
}

.codentricks-service-card-icon-wrapper {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	border-radius: 50%;
	background-color: #1a1a1a;
	transition: all 0.3s ease;
}

.codentricks-service-card-icon-wrapper i {
	color: #c2f82c;
	font-size: 20px;
}

.codentricks-service-card-icon-wrapper svg {
	fill: #c2f82c;
	width: 20px;
	height: 20px;
}

.codentricks-service-card:hover .codentricks-service-card-icon-wrapper {
	background-color: #c2f82c;
}

.codentricks-service-card:hover .codentricks-service-card-icon-wrapper i {
	color: #09090b;
}

.codentricks-service-card:hover .codentricks-service-card-icon-wrapper svg {
	fill: #09090b;
}

.codentricks-service-card-number {
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-size: 14px;
	font-weight: 700;
	color: #444444;
}

.codentricks-service-card-title {
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-size: 22px;
	font-weight: 700;
	color: #ffffff;
	margin: 0 0 14px 0;
	line-height: 1.3;
}

.codentricks-service-card-desc {
	font-family: 'Inter', sans-serif;
	font-size: 14px;
	line-height: 1.6;
	color: #888888;
	margin: 0 0 24px 0;
}

.codentricks-service-card-features {
	background-color: #09090b;
	border-radius: 8px;
	padding: 18px 22px;
	margin: auto 0 24px 0;
	list-style: none;
}

.codentricks-service-card-features li {
	font-family: 'Inter', sans-serif;
	font-size: 13px;
	line-height: 1.8;
	color: #cccccc;
	position: relative;
	padding-left: 24px;
	margin-bottom: 8px;
}

.codentricks-service-card-features li:last-child {
	margin-bottom: 0;
}

.codentricks-service-card-features li::before {
	content: "✓";
	position: absolute;
	left: 0;
	color: #c2f82c;
	font-weight: 700;
}

.codentricks-service-card-footer {
	margin-top: auto;
}

.codentricks-service-card-link {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-size: 13px;
	font-weight: 700;
	color: #888888;
	text-decoration: none !important;
	transition: color 0.3s ease;
	cursor: pointer;
}

.codentricks-service-card-link:hover {
	color: #c2f82c !important;
}

.codentricks-service-card-link .card-link-arrow {
	transition: transform 0.3s ease;
	display: inline-block;
}

.codentricks-service-card-link:hover .card-link-arrow {
	transform: translateX(4px);
}

/* Scroll Top Button styling */
.codentricks-scroll-top-wrapper {
	position: fixed;
	bottom: 40px;
	right: 40px;
	z-index: 9999;
	opacity: 0;
	visibility: hidden;
	transition: all 0.3s ease;
}

.codentricks-scroll-top-wrapper.show {
	opacity: 1;
	visibility: visible;
}

.codentricks-scroll-top-btn {
	display: flex;
	flex-direction: column;
	align-items: center;
	background: transparent;
	border: none;
	cursor: pointer;
	padding: 0;
	outline: none;
}

.codentricks-scroll-top-btn .scroll-top-label {
	writing-mode: vertical-rl;
	transform: rotate(180deg);
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-weight: 700;
	font-size: 11px;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: #ffffff;
	margin-top: 14px;
	transition: color 0.3s ease;
}

.codentricks-scroll-top-btn:hover .scroll-top-label {
	color: #c2f82c;
}

.codentricks-scroll-top-btn .scroll-top-icon-wrapper {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background-color: #c2f82c;
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	box-shadow: 0 4px 15px rgba(0, 0, 0, 0.4);
}

.codentricks-scroll-top-btn .scroll-top-icon-wrapper i {
	color: #09090b;
	font-size: 14px;
}

.codentricks-scroll-top-btn .scroll-top-icon-wrapper svg {
	fill: #09090b;
	width: 14px;
	height: 14px;
}

.codentricks-scroll-top-btn:hover .scroll-top-icon-wrapper {
	transform: translateY(-4px) scale(1.05);
	background-color: #ffffff;
}

/* Responsive adjustments */
@media (max-width: 991px) {
	.codentricks-services-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}
	.codentricks-services-intro-title {
		font-size: 32px;
	}
	.codentricks-scroll-top-wrapper {
		bottom: 20px;
		right: 20px;
	}
}

@media (max-width: 767px) {
	.codentricks-services-grid {
		grid-template-columns: 1fr !important;
	}
	.codentricks-service-card {
		padding: 24px;
	}
	.codentricks-services-intro {
		padding: 10px 0;
	}
}

/* ==========================================================================
   11. CT  PRICE TABLE WIDGET
   ========================================================================== */
.codentricks-price-table-wrapper {
	width: 100%;
	padding: 40px 0;
	font-family: 'Outfit', sans-serif;
}

.codentricks-price-table-header {
	text-align: center;
	margin-bottom: 48px;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.codentricks-price-table-tagline {
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-size: 11px;
	font-weight: 800;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	margin-bottom: 12px;
	color: #9ca3af;
}

.codentricks-price-table-title {
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-size: 40px;
	font-weight: 850;
	color: #ffffff;
	margin: 0 0 24px 0;
	line-height: 1.2;
	letter-spacing: -0.5px;
}

.codentricks-price-toggle-container {
	display: inline-flex;
	background: #090a12;
	border: 1px solid rgba(255, 255, 255, 0.08);
	padding: 4px;
	border-radius: 30px;
	margin: 0 auto;
	gap: 4px;
}

.codentricks-price-toggle-btn {
	background: transparent;
	border: none;
	padding: 8px 24px;
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-size: 13px;
	font-weight: 600;
	color: #9ca3af;
	border-radius: 20px;
	cursor: pointer;
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.codentricks-price-toggle-btn.active {
	background-color: #1b1d2e;
	color: #ffffff;
	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}

.codentricks-price-table-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 28px;
	width: 100%;
}

.codentricks-price-card {
	position: relative;
	background: #0f111e;
	border: 1px solid rgba(255, 255, 255, 0.05);
	border-radius: 16px;
	padding: 40px 32px;
	display: flex;
	flex-direction: column;
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
}

.codentricks-price-card:hover {
	transform: translateY(-6px);
	border-color: rgba(99, 102, 241, 0.25);
	box-shadow: 0 12px 30px rgba(0, 0, 0, 0.4);
}

.codentricks-price-card.highlighted {
	border-color: rgba(99, 102, 241, 0.4);
	box-shadow: 0 8px 32px rgba(99, 102, 241, 0.15);
}

.codentricks-price-card.highlighted:hover {
	border-color: rgba(99, 102, 241, 0.6);
	box-shadow: 0 12px 40px rgba(99, 102, 241, 0.25);
}

.plan-badge {
	position: absolute;
	top: 16px;
	right: 16px;
	background: linear-gradient(135deg, #3b82f6 0%, #8b5cf6 100%);
	color: #ffffff;
	font-size: 10px;
	font-weight: 700;
	padding: 4px 12px;
	border-radius: 20px;
	text-transform: uppercase;
	letter-spacing: 0.5px;
}

.plan-title {
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-size: 20px;
	font-weight: 700;
	color: #ffffff;
	margin: 0 0 8px 0;
}

.plan-desc {
	font-size: 14px;
	color: #9ca3af;
	margin: 0 0 28px 0;
	line-height: 1.5;
	min-height: 42px;
}

.plan-price-row {
	display: flex;
	align-items: baseline;
	font-family: 'Plus Jakarta Sans', sans-serif;
	color: #ffffff;
	margin-bottom: 28px;
}

.price-symbol {
	font-size: 24px;
	font-weight: 600;
	align-self: flex-start;
	margin-top: 4px;
}

.price-val {
	font-size: 48px;
	font-weight: 800;
	line-height: 1;
}

.price-period {
	font-size: 14px;
	color: #9ca3af;
	margin-left: 4px;
}

.price-divider {
	border: none;
	border-top: 1px solid rgba(255, 255, 255, 0.08);
	margin: 0 0 28px 0;
}

.plan-features {
	list-style: none;
	padding: 0;
	margin: 0 0 36px 0;
	display: flex;
	flex-direction: column;
	gap: 16px;
	flex-grow: 1;
}

.plan-features li {
	display: flex;
	align-items: center;
	gap: 12px;
}

.plan-features li span {
	font-size: 14px;
	color: #e5e7eb;
}

.feature-check {
	width: 18px;
	height: 18px;
	flex-shrink: 0;
}

.plan-cta-wrapper {
	margin-top: auto;
}

.plan-cta-btn {
	display: block;
	width: 100%;
	text-align: center;
	padding: 14px 20px;
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-size: 14px;
	font-weight: 700;
	text-decoration: none !important;
	border-radius: 8px;
	border: 1px solid rgba(255, 255, 255, 0.1);
	background-color: #090a12;
	color: #ffffff;
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	cursor: pointer;
}

.plan-cta-btn:hover {
	background-color: #3b82f6;
	border-color: #3b82f6;
	color: #ffffff !important;
	box-shadow: 0 4px 15px rgba(59, 130, 246, 0.4);
	transform: translateY(-2px);
}

.highlighted .plan-cta-btn {
	background-color: #3b82f6;
	border-color: #3b82f6;
	box-shadow: 0 4px 15px rgba(59, 130, 246, 0.25);
}

.highlighted .plan-cta-btn:hover {
	background-color: #2563eb;
	border-color: #2563eb;
	box-shadow: 0 6px 20px rgba(37, 99, 235, 0.4);
}

/* Responsive adjustments */
@media (max-width: 991px) {
	.codentricks-price-table-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 24px;
	}
	.codentricks-price-table-title {
		font-size: 32px;
	}
}

@media (max-width: 640px) {
	.codentricks-price-table-grid {
		grid-template-columns: 1fr;
	}
	.codentricks-price-card {
		padding: 32px 24px;
	}
}

/* ==========================================================================
   12. CT  BLOG SECTION WIDGET
   ========================================================================== */
/* Custom reveal animations */
@keyframes ctBlogFadeInUp {
	from {
		opacity: 0;
		transform: translateY(30px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.codentricks-blog-section-wrapper {
	font-family: 'Outfit', sans-serif;
	padding: 80px 40px;
	border-radius: 32px;
	transition: background-color 0.4s cubic-bezier(0.16, 1, 0.3, 1), color 0.4s ease;
	position: relative;
	overflow: hidden;
}

/* Dark Theme Colors */
.codentricks-blog-section-wrapper.theme-dark {
	background-color: #05070f;
	color: #ffffff;
}
.codentricks-blog-section-wrapper.theme-dark .blog-main-title {
	color: #ffffff;
}
.codentricks-blog-section-wrapper.theme-dark .blog-meta {
	color: rgba(255, 255, 255, 0.5);
}
.codentricks-blog-section-wrapper.theme-dark .blog-meta svg {
	stroke: rgba(255, 255, 255, 0.4);
}
.codentricks-blog-section-wrapper.theme-dark .featured-title a,
.codentricks-blog-section-wrapper.theme-dark .side-title a {
	color: #ffffff;
}
.codentricks-blog-section-wrapper.theme-dark .featured-excerpt {
	color: rgba(255, 255, 255, 0.7);
}
.codentricks-blog-section-wrapper.theme-dark .featured-card {
	background: rgba(255, 255, 255, 0.01);
	border: 1px solid rgba(255, 255, 255, 0.04);
	border-radius: 20px;
	padding: 24px;
	box-shadow: 0 4px 30px rgba(0, 0, 0, 0.2);
}
.codentricks-blog-section-wrapper.theme-dark .side-card {
	background: rgba(255, 255, 255, 0.01);
	border: 1px solid rgba(255, 255, 255, 0.03);
	border-radius: 16px;
	padding: 16px;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
}

/* Light Theme Colors */
.codentricks-blog-section-wrapper.theme-light {
	background-color: #f8fafc;
	color: #1e293b;
}
.codentricks-blog-section-wrapper.theme-light .blog-main-title {
	color: #0f172a;
}
.codentricks-blog-section-wrapper.theme-light .blog-meta {
	color: #64748b;
}
.codentricks-blog-section-wrapper.theme-light .blog-meta svg {
	stroke: #64748b;
}
.codentricks-blog-section-wrapper.theme-light .featured-title a,
.codentricks-blog-section-wrapper.theme-light .side-title a {
	color: #0f172a;
}
.codentricks-blog-section-wrapper.theme-light .featured-excerpt {
	color: #475569;
}
.codentricks-blog-section-wrapper.theme-light .featured-card {
	background: #ffffff;
	border: 1px solid rgba(0, 0, 0, 0.05);
	border-radius: 20px;
	padding: 24px;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.02);
}
.codentricks-blog-section-wrapper.theme-light .side-card {
	background: #ffffff;
	border: 1px solid rgba(0, 0, 0, 0.04);
	border-radius: 16px;
	padding: 16px;
	box-shadow: 0 6px 20px rgba(0, 0, 0, 0.01);
}

/* Header Styles */
.codentricks-blog-section-header {
	text-align: center;
	margin-bottom: 56px;
}
.blog-subtitle {
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 1.5px;
	display: inline-block;
	margin-bottom: 12px;
}
.blog-main-title {
	font-size: 38px;
	font-weight: 800;
	margin: 0;
	letter-spacing: -1px;
	line-height: 1.2;
}

/* Grid Layout */
.codentricks-blog-section-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 32px;
	align-items: stretch; /* Stretch columns to equal height */
}

/* Common Image Wrapper */
.featured-image-wrapper,
.side-image-wrapper {
	position: relative;
	overflow: hidden;
	border-radius: 14px;
	background-color: #000000;
}
.featured-img,
.side-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 0.8s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.4s ease;
}
.featured-card:hover .featured-img,
.side-card:hover .side-img {
	transform: scale(1.06) rotate(0.5deg);
	opacity: 0.85;
}

/* Badge */
.blog-badge {
	position: absolute;
	bottom: 16px;
	left: 16px;
	color: #ffffff;
	font-size: 10px;
	font-weight: 700;
	padding: 6px 14px;
	border-radius: 30px;
	text-transform: uppercase;
	letter-spacing: 1px;
	background: rgba(59, 130, 246, 0.15);
	border: 1px solid rgba(59, 130, 246, 0.3);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
	pointer-events: none;
	transition: all 0.3s ease;
}
.side-image-wrapper .blog-badge {
	bottom: 8px;
	left: 8px;
	font-size: 8px;
	padding: 4px 10px;
	border-radius: 20px;
}

/* Meta Data */
.blog-meta {
	font-size: 12px;
	font-weight: 600;
	margin-bottom: 14px;
	display: flex;
	align-items: center;
	gap: 6px;
	text-transform: uppercase;
	letter-spacing: 0.5px;
}
.blog-meta svg {
	vertical-align: middle;
	display: inline-block;
	margin-right: 4px;
}

/* Underline Animation */
.animated-underline {
	position: relative;
	text-decoration: none !important;
	display: inline;
	background-image: linear-gradient(currentColor, currentColor);
	background-position: 0% 100%;
	background-repeat: no-repeat;
	background-size: 0% 2px;
	transition: background-size 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}
.animated-underline:hover {
	background-size: 100% 2px;
}

/* Featured Card specific */
.blog-featured-col {
	height: 100%;
}
.featured-card {
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	animation: ctBlogFadeInUp 0.8s cubic-bezier(0.16, 1, 0.3, 1) both;
	transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}
.featured-card:hover {
	transform: translateY(-6px);
	box-shadow: 0 16px 40px rgba(0, 0, 0, 0.3);
	border-color: rgba(59, 130, 246, 0.2);
}
.theme-light .featured-card:hover {
	box-shadow: 0 16px 40px rgba(0, 0, 0, 0.05);
	border-color: rgba(59, 130, 246, 0.15);
}
.featured-image-wrapper {
	aspect-ratio: 16 / 9.5;
	margin-bottom: 24px;
}
.featured-title {
	font-size: 24px;
	font-weight: 800;
	line-height: 1.3;
	margin: 0 0 14px 0;
	letter-spacing: -0.5px;
}
.featured-excerpt {
	font-size: 15px;
	line-height: 1.6;
	margin: 0 0 20px 0;
}

/* Side Card specific */
.blog-sidebar-col {
	display: flex;
	flex-direction: column;
	gap: 20px;
	height: 100%;
	justify-content: space-between; /* Distribute cards evenly */
}
.side-card {
	height: calc(33.33% - 13.33px); /* Equal size for all 3 cards */
	display: flex;
	gap: 20px;
	align-items: center;
	box-sizing: border-box;
	transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}
.side-card:nth-child(1) { animation: ctBlogFadeInUp 0.8s cubic-bezier(0.16, 1, 0.3, 1) 0.15s both; }
.side-card:nth-child(2) { animation: ctBlogFadeInUp 0.8s cubic-bezier(0.16, 1, 0.3, 1) 0.25s both; }
.side-card:nth-child(3) { animation: ctBlogFadeInUp 0.8s cubic-bezier(0.16, 1, 0.3, 1) 0.35s both; }

.side-card:hover {
	transform: translateX(8px);
	background: rgba(255, 255, 255, 0.03) !important;
	border-color: rgba(59, 130, 246, 0.15) !important;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2) !important;
}
.theme-light .side-card:hover {
	background: #ffffff !important;
	border-color: rgba(59, 130, 246, 0.1) !important;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.03) !important;
}
.side-image-wrapper {
	width: 170px;
	height: 110px;
	flex-shrink: 0;
	border-radius: 12px;
}
.side-content {
	flex-grow: 1;
}
.side-content .blog-meta {
	margin-bottom: 8px;
}
.side-title {
	font-size: 15px;
	font-weight: 700;
	line-height: 1.4;
	margin: 0;
	letter-spacing: -0.2px;
}
.side-excerpt {
	font-family: 'Inter', sans-serif !important;
	font-size: 13px !important;
	line-height: 1.5 !important;
	margin: 6px 0 0 0 !important;
	transition: color 0.3s ease;
}
.theme-dark .side-excerpt {
	color: rgba(255, 255, 255, 0.6) !important;
}
.theme-light .side-excerpt {
	color: #4b5563 !important;
}

/* Read More Button styling */
.blog-read-more-wrapper {
	margin-top: auto;
	display: block;
}
.blog-read-more-btn {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 13px;
	font-weight: 700;
	text-decoration: none !important;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	transition: all 0.3s ease;
	color: inherit;
}
.blog-read-more-btn svg {
	transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.blog-read-more-btn:hover {
	opacity: 0.9;
}
.blog-read-more-btn:hover svg {
	transform: translateX(4px);
}

/* Placeholder styles */
.featured-img-placeholder,
.side-img-placeholder {
	width: 100%;
	height: 100%;
	background: linear-gradient(135deg, #1e293b, #0f172a);
}

/* Responsive adjustments */
@media (max-width: 1024px) {
	.codentricks-blog-section-grid {
		grid-template-columns: 1fr;
		gap: 40px;
	}
	.side-card {
		gap: 20px;
	}
	.side-image-wrapper {
		width: 150px;
		height: 100px;
	}
}

@media (max-width: 768px) {
	.codentricks-blog-section-wrapper {
		padding: 40px 20px;
	}
	.blog-main-title {
		font-size: 24px;
	}
	.featured-title {
		font-size: 18px;
	}
	.side-title {
		font-size: 13px;
	}
}

@media (max-width: 480px) {
	.side-card {
		flex-direction: column;
		align-items: stretch;
	}
	.side-image-wrapper {
		width: 100%;
		height: auto;
		aspect-ratio: 16 / 10;
	}
}

/* ==========================================================================
   13. CT  SOFTWARE HERO WIDGET
   ========================================================================== */
.codentricks-software-hero-wrapper {
	font-family: 'Outfit', sans-serif;
	padding: 80px 0;
	transition: background 0.3s ease, color 0.3s ease;
	overflow: hidden;
}

/* Dark Theme Colors */
.codentricks-software-hero-wrapper.theme-dark {
	background: linear-gradient(135deg, #0b0f19 0%, #080b11 100%);
	color: #ffffff;
}
.codentricks-software-hero-wrapper.theme-dark .hero-title {
	color: #ffffff;
}
.codentricks-software-hero-wrapper.theme-dark .hero-description {
	color: #94a3b8;
}
.codentricks-software-hero-wrapper.theme-dark .codentricks-btn-secondary {
	border: 2px solid rgba(255, 255, 255, 0.15);
	color: #ffffff;
}
.codentricks-software-hero-wrapper.theme-dark .codentricks-btn-secondary:hover {
	background: rgba(255, 255, 255, 0.05);
	border-color: #ffffff;
}
.codentricks-software-hero-wrapper.theme-dark .process-connector-line {
	stroke: rgba(255, 255, 255, 0.05);
}
.codentricks-software-hero-wrapper.theme-dark .process-center-card {
	background: rgba(15, 23, 42, 0.75);
	border: 1px solid rgba(255, 255, 255, 0.08);
	box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
}
.codentricks-software-hero-wrapper.theme-dark .step-desc-wrapper p {
	color: #94a3b8;
}
.codentricks-software-hero-wrapper.theme-dark .node-circle {
	background: rgba(15, 23, 42, 0.85);
	border: 2px solid rgba(255, 255, 255, 0.1);
}
.codentricks-software-hero-wrapper.theme-dark .step-node .node-icon svg {
	fill: #cbd5e1;
}
.codentricks-software-hero-wrapper.theme-dark .step-node .node-label {
	color: #94a3b8;
}
.codentricks-software-hero-wrapper.theme-dark .step-node.active .node-label {
	color: #ffffff;
}
.codentricks-software-hero-wrapper.theme-dark .hero-content-box {
	background: rgba(15, 23, 42, 0.45);
	border: 1px solid rgba(255, 255, 255, 0.08);
	box-shadow: 0 30px 60px rgba(0, 0, 0, 0.25);
}

/* Light Theme Colors */
.codentricks-software-hero-wrapper.theme-light {
	background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
	color: #1e293b;
}
.codentricks-software-hero-wrapper.theme-light .hero-title {
	color: #0f172a;
}
.codentricks-software-hero-wrapper.theme-light .hero-description {
	color: #475569;
}
.codentricks-software-hero-wrapper.theme-light .codentricks-btn-secondary {
	border: 2px solid rgba(15, 23, 42, 0.15);
	color: #0f172a;
}
.codentricks-software-hero-wrapper.theme-light .codentricks-btn-secondary:hover {
	background: rgba(15, 23, 42, 0.05);
	border-color: #0f172a;
}
.codentricks-software-hero-wrapper.theme-light .process-connector-line {
	stroke: rgba(15, 23, 42, 0.05);
}
.codentricks-software-hero-wrapper.theme-light .process-center-card {
	background: rgba(255, 255, 255, 0.85);
	border: 1px solid rgba(0, 0, 0, 0.08);
	box-shadow: 0 20px 40px rgba(15, 23, 42, 0.08);
}
.codentricks-software-hero-wrapper.theme-light .step-desc-wrapper p {
	color: #475569;
}
.codentricks-software-hero-wrapper.theme-light .node-circle {
	background: rgba(255, 255, 255, 0.95);
	border: 2px solid rgba(0, 0, 0, 0.1);
}
.codentricks-software-hero-wrapper.theme-light .step-node .node-icon svg {
	fill: #475569;
}
.codentricks-software-hero-wrapper.theme-light .step-node .node-label {
	color: #64748b;
}
.codentricks-software-hero-wrapper.theme-light .step-node.active .node-label {
	color: #0f172a;
}
.codentricks-software-hero-wrapper.theme-light .hero-content-box {
	background: rgba(255, 255, 255, 0.65);
	border: 1px solid rgba(0, 0, 0, 0.06);
	box-shadow: 0 30px 60px rgba(15, 23, 42, 0.06);
}

/* Layout Grid */
.codentricks-software-hero-grid {
	display: grid;
	grid-template-columns: 0.95fr 1.05fr;
	gap: 60px;
	align-items: center;
	max-width: 1200px;
	margin: 0 auto;
	width: 100%;
	padding: 0 24px;
}

/* Content Column */
.hero-content-col {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}
.hero-content-box {
	width: 100%;
	padding: 40px;
	border-radius: 24px;
	backdrop-filter: blur(16px);
	-webkit-backdrop-filter: blur(16px);
	transition: all 0.3s ease;
}
.hero-subtitle {
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 1.5px;
	margin-bottom: 16px;
}
.hero-title {
	font-size: 46px;
	font-weight: 800;
	line-height: 1.2;
	margin: 0 0 20px 0;
	letter-spacing: -1px;
	background: linear-gradient(120deg, #3b82f6 0%, #a855f7 25%, #ef4444 50%, #06b6d4 75%, #3b82f6 100%);
	background-size: 200% auto;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent !important;
	animation: title-gradient-shift 6s linear infinite;
}
.hero-description {
	font-size: 16px;
	line-height: 1.6;
	margin: 0 0 36px 0;
}
.hero-buttons-wrapper {
	display: flex;
	gap: 16px;
}

/* Buttons Core Styling */
.codentricks-btn {
	display: inline-block;
	padding: 14px 28px;
	border-radius: 12px;
	font-size: 15px;
	font-weight: 600;
	text-decoration: none;
	text-align: center;
	cursor: pointer;
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.codentricks-btn-primary {
	color: #ffffff !important;
}
.codentricks-btn-primary:hover {
	transform: translateY(-2px);
}
.codentricks-btn-secondary {
	background: transparent;
}
.codentricks-btn-secondary:hover {
	transform: translateY(-2px);
}

/* Animation Column / Canvas */
.hero-animation-col {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
}
.process-loop-container {
	position: relative;
	width: 100%;
	aspect-ratio: 500 / 400;
	max-width: 500px;
	container-type: inline-size;
	container-name: process-loop;

	/* Dynamic stage signature colors */
	--step-1-color: #3b82f6; /* Blue - Plan */
	--step-2-color: #a855f7; /* Purple - Design */
	--step-3-color: #10b981; /* Green - Code */
	--step-4-color: #eab308; /* Yellow - Test */
	--step-5-color: #ef4444; /* Red - Launch */
	--step-6-color: #06b6d4; /* Cyan - Monitor */
}

/* Background Connector SVG */
.process-connector-canvas {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	pointer-events: none;
	z-index: 1;
}
.process-connector-line {
	stroke-width: 2px;
	fill: none;
}
.process-connector-glow {
	stroke-width: 2.5px;
	fill: none;
	stroke-dasharray: 20, 180;
	stroke-dashoffset: 0;
	animation: dashflow 5s linear infinite;
	filter: drop-shadow(0 0 4px currentColor);
}

@keyframes dashflow {
	to {
		stroke-dashoffset: -200;
	}
}

@keyframes title-gradient-shift {
	0% { background-position: 0% center; }
	100% { background-position: 200% center; }
}

/* Rocket Track and Visible Path Line */
.rocket-path-line {
	display: none !important;
}

/* Rocket Trail Line */
.rocket-trail-line {
	opacity: 0;
	stroke-width: 5px;
	stroke-linecap: round;
	stroke-dasharray: 120, 680;
	stroke-dashoffset: 120;
	pointer-events: none;
	filter: drop-shadow(0 0 8px rgba(239, 68, 68, 0.9));
}

.process-loop-container.active-step-5 .rocket-trail-line {
	opacity: 0.7;
	animation: trail-move 3.2s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

@keyframes trail-move {
	0% {
		stroke-dashoffset: 120;
		opacity: 0;
	}
	10% {
		opacity: 1;
	}
	80% {
		opacity: 1;
	}
	95%, 100% {
		stroke-dashoffset: -560; /* 120 - 680 */
		opacity: 0;
	}
}

/* Rocket Element */
.codentricks-rocket {
	position: absolute;
	width: 70px;
	height: 70px;
	z-index: 15;
	pointer-events: none;
	opacity: 0;
	offset-path: path('M 165,348 C 240,375 320,385 375,348 C 425,310 445,260 455,200 C 465,130 465,50 465,-150');
	offset-path: url(#rocket-track-path);
	offset-rotate: auto;
	transform-origin: center center;
}

.process-loop-container.active-step-5 .codentricks-rocket {
	animation: rocket-launch-fly 3.2s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

@keyframes rocket-launch-fly {
	0% {
		offset-distance: 0%;
		opacity: 0;
		transform: scale(0.6);
	}
	10% {
		opacity: 1;
		transform: scale(1);
	}
	80% {
		opacity: 1;
		transform: scale(1);
	}
	95%, 100% {
		offset-distance: 100%;
		opacity: 0;
		transform: scale(0.8);
	}
}

/* High-fidelity Roaring Jet Exhaust Flame Animations */
.rocket-flame-outer {
	animation: flame-pulse-outer 0.08s infinite alternate ease-in-out;
	transform-origin: 18px 32px;
}
.rocket-flame-mid {
	animation: flame-pulse-mid 0.06s infinite alternate-reverse ease-in-out;
	transform-origin: 18px 32px;
}
.rocket-flame-inner {
	animation: flame-pulse-inner 0.05s infinite alternate ease-in-out;
	transform-origin: 18px 32px;
}

@keyframes flame-pulse-outer {
	0% {
		transform: scaleX(0.8) scaleY(0.9);
		filter: drop-shadow(-4px 0 6px #ef4444);
	}
	100% {
		transform: scaleX(1.3) scaleY(1.1);
		filter: drop-shadow(-8px 0 10px #ef4444);
	}
}

@keyframes flame-pulse-mid {
	0% {
		transform: scaleX(0.9) scaleY(0.9);
		filter: drop-shadow(-3px 0 4px #f97316);
	}
	100% {
		transform: scaleX(1.2) scaleY(1.05);
		filter: drop-shadow(-6px 0 8px #f97316);
	}
}

@keyframes flame-pulse-inner {
	0% {
		transform: scaleX(0.95) scaleY(0.95);
		fill: #facc15;
	}
	100% {
		transform: scaleX(1.15) scaleY(1.05);
		fill: #ffffff;
	}
}

/* Spark Particles */
.rocket-spark {
	opacity: 0;
	transform-origin: 32px 32px;
}
.spark-1 {
	animation: spark-fly-1 0.3s infinite linear;
}
.spark-2 {
	animation: spark-fly-2 0.25s infinite linear 0.1s;
}
.spark-3 {
	animation: spark-fly-3 0.35s infinite linear 0.05s;
}

@keyframes spark-fly-1 {
	0% {
		transform: translate(0, 0) scale(1);
		opacity: 1;
	}
	100% {
		transform: translate(-30px, -6px) scale(0.2);
		opacity: 0;
	}
}

@keyframes spark-fly-2 {
	0% {
		transform: translate(0, 0) scale(1);
		opacity: 1;
	}
	100% {
		transform: translate(-25px, 8px) scale(0.2);
		opacity: 0;
	}
}

@keyframes spark-fly-3 {
	0% {
		transform: translate(0, 0) scale(1);
		opacity: 1;
	}
	100% {
		transform: translate(-35px, 1px) scale(0.2);
		opacity: 0;
	}
}



/* Center Glassmorphism Card */
.process-center-card {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 170px;
	height: 170px;
	width: 34cqw;
	height: 34cqw;
	border-radius: 50%;
	padding: 16px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	z-index: 2;
	backdrop-filter: blur(16px);
	-webkit-backdrop-filter: blur(16px);
	overflow: hidden;
	box-sizing: border-box;
}

/* Background Animation Sandbox styling */
.process-center-card .codentricks-animation-sandbox {
	position: relative;
	width: 100%;
	height: 75px;
	height: 15cqw;
	background: transparent;
	border: none;
	opacity: 1;
	pointer-events: none;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	margin-bottom: 4px;
	min-height: 0 !important;
	max-height: none !important;
	min-width: 0 !important;
	max-width: none !important;
}

.process-center-card .codentricks-animation-sandbox .codentricks-micro-anim {
	width: 100%;
	height: 100%;
	min-height: 0 !important;
	max-height: none !important;
	min-width: 0 !important;
	max-width: none !important;
	display: none;
	align-items: center;
	justify-content: center;
	transform: scale(0.42);
	transform-origin: center center;
}

.process-center-card .codentricks-animation-sandbox .codentricks-micro-anim.is-active {
	display: flex;
}

.process-center-card .codentricks-animation-sandbox .wireframe-browser,
.process-center-card .codentricks-animation-sandbox .anim-code-container,
.process-center-card .codentricks-animation-sandbox .anim-deploy-container,
.process-center-card .codentricks-animation-sandbox .anim-monitor-container {
	background: transparent !important;
	border-color: rgba(255, 255, 255, 0.1) !important;
}

.step-desc-wrapper {
	position: relative;
	z-index: 3;
	display: flex;
	flex-direction: column;
	align-items: center;
	transition: opacity 0.3s ease, transform 0.3s ease;
	width: 100%;
}
.step-desc-wrapper.switching {
	opacity: 0;
	transform: translate3d(0, 10px, 0) scale(0.95);
}
.step-desc-number {
	font-size: 11px;
	font-size: 2.2cqw;
	font-weight: 700;
	letter-spacing: 1px;
	opacity: 0.6;
	margin-bottom: 2px;
}
.step-desc-wrapper h5 {
	font-size: 15px;
	font-size: 3cqw;
	font-weight: 700;
	margin: 0 0 3px 0;
	text-transform: uppercase;
}
.step-desc-wrapper p {
	font-size: 11px;
	font-size: 2.2cqw;
	line-height: 1.3;
	margin: 0;
}

/* Step Nodes */
.step-node {
	position: absolute;
	transform: translate(-50%, -50%);
	width: 80px;
	text-align: center;
	cursor: pointer;
	z-index: 3;
}
.node-circle {
	position: relative;
	width: 56px;
	height: 56px;
	border-radius: 50%;
	margin: 0 auto 8px auto;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}
.node-number {
	position: absolute;
	left: 38px;
	top: -4px;
	font-size: 9px;
	font-weight: 700;
	width: 18px;
	height: 18px;
	line-height: 18px;
	border-radius: 50%;
	text-align: center;
	color: #ffffff;
	background-color: #4b5563;
	transition: background-color 0.3s ease;
}
.node-icon {
	width: 22px;
	height: 22px;
	display: flex;
	align-items: center;
	justify-content: center;
}
.node-icon svg {
	width: 100%;
	height: 100%;
	transition: all 0.3s ease;
}
.node-label {
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	display: block;
	transition: color 0.3s ease;
}

/* Step Node Hover & Active states */
.step-node:hover .node-circle {
	transform: scale(1.1);
}
.step-node.active .node-circle {
	transform: scale(1.15);
}

/* Individual Stage Glowing Aesthetics */
.codentricks-software-hero-wrapper .step-node.step-1.active .node-circle {
	border-color: var(--step-1-color) !important;
	box-shadow: 0 0 20px rgba(59, 130, 246, 0.5) !important;
}
.codentricks-software-hero-wrapper .step-node.step-1.active .node-number {
	background-color: var(--step-1-color) !important;
}
.codentricks-software-hero-wrapper .step-node.step-1.active .node-icon svg {
	fill: var(--step-1-color) !important;
	filter: drop-shadow(0 0 8px var(--step-1-color)) !important;
}
.codentricks-software-hero-wrapper .step-node.step-1.active .node-label {
	color: var(--step-1-color) !important;
}
.process-loop-container.active-step-1 .process-connector-glow {
	stroke: var(--step-1-color) !important;
	filter: drop-shadow(0 0 10px var(--step-1-color)) !important;
}
.process-loop-container.active-step-1 .step-desc-wrapper h5 {
	color: var(--step-1-color) !important;
}

.codentricks-software-hero-wrapper .step-node.step-2.active .node-circle {
	border-color: var(--step-2-color) !important;
	box-shadow: 0 0 20px rgba(168, 85, 247, 0.5) !important;
}
.codentricks-software-hero-wrapper .step-node.step-2.active .node-number {
	background-color: var(--step-2-color) !important;
}
.codentricks-software-hero-wrapper .step-node.step-2.active .node-icon svg {
	fill: var(--step-2-color) !important;
	filter: drop-shadow(0 0 8px var(--step-2-color)) !important;
}
.codentricks-software-hero-wrapper .step-node.step-2.active .node-label {
	color: var(--step-2-color) !important;
}
.process-loop-container.active-step-2 .process-connector-glow {
	stroke: var(--step-2-color) !important;
	filter: drop-shadow(0 0 10px var(--step-2-color)) !important;
}
.process-loop-container.active-step-2 .step-desc-wrapper h5 {
	color: var(--step-2-color) !important;
}

.codentricks-software-hero-wrapper .step-node.step-3.active .node-circle {
	border-color: var(--step-3-color) !important;
	box-shadow: 0 0 20px rgba(16, 185, 129, 0.5) !important;
}
.codentricks-software-hero-wrapper .step-node.step-3.active .node-number {
	background-color: var(--step-3-color) !important;
}
.codentricks-software-hero-wrapper .step-node.step-3.active .node-icon svg {
	fill: var(--step-3-color) !important;
	filter: drop-shadow(0 0 8px var(--step-3-color)) !important;
}
.codentricks-software-hero-wrapper .step-node.step-3.active .node-label {
	color: var(--step-3-color) !important;
}
.process-loop-container.active-step-3 .process-connector-glow {
	stroke: var(--step-3-color) !important;
	filter: drop-shadow(0 0 10px var(--step-3-color)) !important;
}
.process-loop-container.active-step-3 .step-desc-wrapper h5 {
	color: var(--step-3-color) !important;
}

.codentricks-software-hero-wrapper .step-node.step-4.active .node-circle {
	border-color: var(--step-4-color) !important;
	box-shadow: 0 0 20px rgba(234, 179, 8, 0.5) !important;
}
.codentricks-software-hero-wrapper .step-node.step-4.active .node-number {
	background-color: var(--step-4-color) !important;
}
.codentricks-software-hero-wrapper .step-node.step-4.active .node-icon svg {
	fill: var(--step-4-color) !important;
	filter: drop-shadow(0 0 8px var(--step-4-color)) !important;
}
.codentricks-software-hero-wrapper .step-node.step-4.active .node-label {
	color: var(--step-4-color) !important;
}
.process-loop-container.active-step-4 .process-connector-glow {
	stroke: var(--step-4-color) !important;
	filter: drop-shadow(0 0 10px var(--step-4-color)) !important;
}
.process-loop-container.active-step-4 .step-desc-wrapper h5 {
	color: var(--step-4-color) !important;
}

.codentricks-software-hero-wrapper .step-node.step-5.active .node-circle {
	border-color: var(--step-5-color) !important;
	box-shadow: 0 0 20px rgba(239, 68, 68, 0.5) !important;
}
.codentricks-software-hero-wrapper .step-node.step-5.active .node-number {
	background-color: var(--step-5-color) !important;
}
.codentricks-software-hero-wrapper .step-node.step-5.active .node-icon svg {
	fill: var(--step-5-color) !important;
	filter: drop-shadow(0 0 8px var(--step-5-color)) !important;
}
.codentricks-software-hero-wrapper .step-node.step-5.active .node-label {
	color: var(--step-5-color) !important;
}
.process-loop-container.active-step-5 .process-connector-glow {
	stroke: var(--step-5-color) !important;
	filter: drop-shadow(0 0 10px var(--step-5-color)) !important;
}
.process-loop-container.active-step-5 .step-desc-wrapper h5 {
	color: var(--step-5-color) !important;
}

.codentricks-software-hero-wrapper .step-node.step-6.active .node-circle {
	border-color: var(--step-6-color) !important;
	box-shadow: 0 0 20px rgba(6, 182, 212, 0.5) !important;
}
.codentricks-software-hero-wrapper .step-node.step-6.active .node-number {
	background-color: var(--step-6-color) !important;
}
.codentricks-software-hero-wrapper .step-node.step-6.active .node-icon svg {
	fill: var(--step-6-color) !important;
	filter: drop-shadow(0 0 8px var(--step-6-color)) !important;
}
.codentricks-software-hero-wrapper .step-node.step-6.active .node-label {
	color: var(--step-6-color) !important;
}
.process-loop-container.active-step-6 .process-connector-glow {
	stroke: var(--step-6-color) !important;
	filter: drop-shadow(0 0 10px var(--step-6-color)) !important;
}
.process-loop-container.active-step-6 .step-desc-wrapper h5 {
	color: var(--step-6-color) !important;
}

/* Radar & Shield Animation for Stage 6 (Monitor) */
.radar-shield-group {
	opacity: 0;
	transition: opacity 0.6s cubic-bezier(0.4, 0, 0.2, 1);
	pointer-events: none;
}
.process-loop-container.active-step-6 .radar-shield-group {
	opacity: 1;
}

/* Rotating Sweep Beam */
.radar-sweep-beam {
	transform-origin: 250px 200px;
	mix-blend-mode: screen;
}
.process-loop-container.active-step-6 .radar-sweep-beam {
	animation: radar-sweep-spin 5s infinite linear;
}

@keyframes radar-sweep-spin {
	from {
		transform: rotate(0deg);
	}
	to {
		transform: rotate(360deg);
	}
}

/* Radar Grid rings & lines */
.radar-grid-ring {
	fill: none;
	stroke: rgba(6, 182, 212, 0.15);
	stroke-width: 1px;
	stroke-dasharray: 4, 6;
}
.radar-grid-line {
	stroke: rgba(6, 182, 212, 0.1);
	stroke-width: 1px;
}

/* Pulsing Concentric Hexagons Shield */
.shield-pulse {
	fill: none;
	stroke: rgba(6, 182, 212, 0.6);
	stroke-width: 2.5px;
	transform-origin: 250px 200px;
	opacity: 0;
}

/* Delay staggered animations */
.process-loop-container.active-step-6 .shield-pulse.pulse-1 {
	animation: shield-expand-pulse 3.6s infinite cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.process-loop-container.active-step-6 .shield-pulse.pulse-2 {
	animation: shield-expand-pulse 3.6s infinite cubic-bezier(0.25, 0.46, 0.45, 0.94) 1.2s;
}
.process-loop-container.active-step-6 .shield-pulse.pulse-3 {
	animation: shield-expand-pulse 3.6s infinite cubic-bezier(0.25, 0.46, 0.45, 0.94) 2.4s;
}

@keyframes shield-expand-pulse {
	0% {
		transform: scale(0.35);
		opacity: 0;
		stroke: rgba(6, 182, 212, 0.85);
		filter: drop-shadow(0 0 3px rgba(6, 182, 212, 0.85));
	}
	40% {
		opacity: 0.65;
		stroke: rgba(6, 182, 212, 0.5);
		filter: drop-shadow(0 0 6px rgba(6, 182, 212, 0.5));
	}
	100% {
		transform: scale(1);
		opacity: 0;
		stroke: rgba(6, 182, 212, 0);
	}
}

/* Testing & QA Scan Animation for Stage 4 (Test) */
.testing-scan-group {
	opacity: 0;
	transition: opacity 0.6s cubic-bezier(0.4, 0, 0.2, 1);
	pointer-events: none;
}
.process-loop-container.active-step-4 .testing-scan-group {
	opacity: 1;
}

/* Scanner sweep animation */
.scanner-bar-container {
	transform-origin: 250px 200px;
}
.process-loop-container.active-step-4 .scanner-bar-container {
	animation: testing-scanner-sweep 4s infinite ease-in-out;
}

@keyframes testing-scanner-sweep {
	0%, 100% {
		transform: translateY(-142px);
	}
	50% {
		transform: translateY(142px);
	}
}

/* Testing Nodes Core */
.test-dot {
	fill: #eab308;
	transition: fill 0.3s ease, filter 0.3s ease;
	filter: drop-shadow(0 0 2px #eab308);
}
.test-dot-pulse {
	fill: none;
	stroke: #eab308;
	stroke-width: 1.5px;
	opacity: 0;
}

/* Sync dot animations with scanner position */
.process-loop-container.active-step-4 .dot-1,
.process-loop-container.active-step-4 .dot-2 {
	animation: dot-state-top 4s infinite ease-in-out;
}
.process-loop-container.active-step-4 .dot-1-pulse {
	transform-origin: 180px 120px;
	animation: dot-pulse-top 4s infinite ease-in-out;
}
.process-loop-container.active-step-4 .dot-2-pulse {
	transform-origin: 320px 120px;
	animation: dot-pulse-top 4s infinite ease-in-out;
}

.process-loop-container.active-step-4 .dot-3,
.process-loop-container.active-step-4 .dot-4 {
	animation: dot-state-mid 4s infinite ease-in-out;
}
.process-loop-container.active-step-4 .dot-3-pulse {
	transform-origin: 140px 240px;
	animation: dot-pulse-mid 4s infinite ease-in-out;
}
.process-loop-container.active-step-4 .dot-4-pulse {
	transform-origin: 360px 240px;
	animation: dot-pulse-mid 4s infinite ease-in-out;
}

.process-loop-container.active-step-4 .dot-5 {
	animation: dot-state-bottom 4s infinite ease-in-out;
}
.process-loop-container.active-step-4 .dot-5-pulse {
	transform-origin: 250px 300px;
	animation: dot-pulse-bottom 4s infinite ease-in-out;
}

/* Keyframes for Node States: Yellow (Testing) to Green (Pass) */
@keyframes dot-state-top {
	0%, 5% { fill: #eab308; filter: drop-shadow(0 0 2px #eab308); }
	15%, 85% { fill: #10b981; filter: drop-shadow(0 0 8px #10b981); }
	95%, 100% { fill: #eab308; filter: drop-shadow(0 0 2px #eab308); }
}
@keyframes dot-pulse-top {
	0%, 5% { transform: scale(0.5); opacity: 0; }
	10% { transform: scale(2.2); opacity: 0.85; stroke: #10b981; }
	20%, 85% { transform: scale(1); opacity: 0; }
	95%, 100% { transform: scale(0.5); opacity: 0; }
}

@keyframes dot-state-mid {
	0%, 20% { fill: #eab308; filter: drop-shadow(0 0 2px #eab308); }
	30%, 70% { fill: #10b981; filter: drop-shadow(0 0 8px #10b981); }
	80%, 100% { fill: #eab308; filter: drop-shadow(0 0 2px #eab308); }
}
@keyframes dot-pulse-mid {
	0%, 20% { transform: scale(0.5); opacity: 0; }
	25% { transform: scale(2.2); opacity: 0.85; stroke: #10b981; }
	35%, 70% { transform: scale(1); opacity: 0; }
	80%, 100% { transform: scale(0.5); opacity: 0; }
}

@keyframes dot-state-bottom {
	0%, 45% { fill: #eab308; filter: drop-shadow(0 0 2px #eab308); }
	55%, 60% { fill: #10b981; filter: drop-shadow(0 0 8px #10b981); }
	70%, 100% { fill: #eab308; filter: drop-shadow(0 0 2px #eab308); }
}
@keyframes dot-pulse-bottom {
	0%, 45% { transform: scale(0.5); opacity: 0; }
	50% { transform: scale(2.2); opacity: 0.85; stroke: #10b981; }
	60%, 100% { transform: scale(1); opacity: 0; }
}

/* Coding & Programming Flow Animation for Stage 3 (Code) */
.coding-anim-group {
	opacity: 0;
	transition: opacity 0.6s cubic-bezier(0.4, 0, 0.2, 1);
	pointer-events: none;
}
.process-loop-container.active-step-3 .coding-anim-group {
	opacity: 1;
}

/* Falling characters */
.coding-char {
	fill: var(--step-3-color);
	font-family: monospace;
	font-size: 11px;
	font-weight: 700;
	opacity: 0;
	text-anchor: middle;
	filter: drop-shadow(0 0 2px var(--step-3-color));
}
.coding-stream {
	transform: translateY(0);
}
.process-loop-container.active-step-3 .coding-char {
	opacity: 0.7;
}

/* staggered waterfall delay */
.process-loop-container.active-step-3 .coding-stream.stream-1 {
	animation: coding-stream-fall 3.5s infinite linear;
}
.process-loop-container.active-step-3 .coding-stream.stream-2 {
	animation: coding-stream-fall 4.2s infinite linear 0.8s;
}
.process-loop-container.active-step-3 .coding-stream.stream-3 {
	animation: coding-stream-fall 3.8s infinite linear 0.4s;
}
.process-loop-container.active-step-3 .coding-stream.stream-4 {
	animation: coding-stream-fall 4.8s infinite linear 1.2s;
}
.process-loop-container.active-step-3 .coding-stream.stream-5 {
	animation: coding-stream-fall 3.6s infinite linear 0.6s;
}

@keyframes coding-stream-fall {
	0% {
		transform: translateY(-200px);
		opacity: 0;
	}
	10% {
		opacity: 0.75;
	}
	90% {
		opacity: 0.75;
	}
	100% {
		transform: translateY(350px);
		opacity: 0;
	}
}

/* Circuit background paths */
.code-circuit-bg {
	fill: none;
	stroke: rgba(16, 185, 129, 0.08);
	stroke-width: 1.5px;
}
.code-circuit-glow {
	fill: none;
	stroke: var(--step-3-color);
	stroke-width: 2px;
	filter: drop-shadow(0 0 3px var(--step-3-color));
}

.code-circuit-glow.path-1 {
	stroke-dasharray: 15 150;
	stroke-dashoffset: 0;
}
.process-loop-container.active-step-3 .code-circuit-glow.path-1 {
	animation: code-circuit-flow-1 3s infinite linear;
}
.code-circuit-glow.path-2 {
	stroke-dasharray: 20 250;
	stroke-dashoffset: 0;
}
.process-loop-container.active-step-3 .code-circuit-glow.path-2 {
	animation: code-circuit-flow-2 4.5s infinite linear;
}
.code-circuit-glow.path-3 {
	stroke-dasharray: 15 150;
	stroke-dashoffset: 0;
}
.process-loop-container.active-step-3 .code-circuit-glow.path-3 {
	animation: code-circuit-flow-3 3.5s infinite linear;
}

@keyframes code-circuit-flow-1 {
	to { stroke-dashoffset: -165; }
}
@keyframes code-circuit-flow-2 {
	to { stroke-dashoffset: -270; }
}
@keyframes code-circuit-flow-3 {
	to { stroke-dashoffset: -165; }
}

/* UI Design Animation for Stage 2 (Design) */
.design-anim-group {
	opacity: 0;
	transition: opacity 0.6s cubic-bezier(0.4, 0, 0.2, 1);
	pointer-events: none;
}
.process-loop-container.active-step-2 .design-anim-group {
	opacity: 1;
}

/* Wireframe Paths (Drawing Effect) */
.design-wireframe-path {
	fill: none;
	stroke: var(--step-2-color);
	stroke-width: 1.5px;
	filter: drop-shadow(0 0 3px rgba(168, 85, 247, 0.4));
	stroke-dasharray: 1000;
	stroke-dashoffset: 1000;
}
.process-loop-container.active-step-2 .wireframe-outer {
	animation: wireframe-draw 4s infinite ease-in-out;
}
.process-loop-container.active-step-2 .wireframe-header {
	animation: wireframe-draw 4s infinite ease-in-out 0.5s;
}

@keyframes wireframe-draw {
	0% {
		stroke-dashoffset: 1000;
	}
	50%, 90% {
		stroke-dashoffset: 0;
	}
	100% {
		stroke-dashoffset: -1000;
	}
}

/* Layout blocks scaling in/fading in */
.design-layout-rect {
	fill: rgba(168, 85, 247, 0.05);
	stroke: rgba(168, 85, 247, 0.25);
	stroke-width: 1px;
	transform-origin: center;
	transform: scale(0);
	opacity: 0;
}
.process-loop-container.active-step-2 .design-layout-rect.rect-1 {
	transform-origin: 165px 165px;
	animation: layout-pop 4s infinite cubic-bezier(0.34, 1.56, 0.64, 1) 0.8s;
}
.process-loop-container.active-step-2 .design-layout-rect.rect-2 {
	transform-origin: 335px 165px;
	animation: layout-pop 4s infinite cubic-bezier(0.34, 1.56, 0.64, 1) 1.1s;
}
.process-loop-container.active-step-2 .design-layout-rect.rect-3 {
	transform-origin: 250px 252px;
	animation: layout-pop 4s infinite cubic-bezier(0.34, 1.56, 0.64, 1) 1.4s;
}

@keyframes layout-pop {
	0% {
		transform: scale(0);
		opacity: 0;
	}
	20%, 85% {
		transform: scale(1);
		opacity: 1;
	}
	95%, 100% {
		transform: scale(0);
		opacity: 0;
	}
}

/* Vector Anchor points */
.anchor-point {
	fill: #ffffff;
	stroke: var(--step-2-color);
	stroke-width: 1.5px;
	transform-origin: center;
	transform: scale(0);
	filter: drop-shadow(0 0 3px var(--step-2-color));
}
.process-loop-container.active-step-2 .anchor-1 {
	transform-origin: 120px 100px;
	animation: anchor-pop 4s infinite cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
.process-loop-container.active-step-2 .anchor-2 {
	transform-origin: 380px 100px;
	animation: anchor-pop 4s infinite cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.2s;
}
.process-loop-container.active-step-2 .anchor-3 {
	transform-origin: 380px 300px;
	animation: anchor-pop 4s infinite cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.4s;
}
.process-loop-container.active-step-2 .anchor-4 {
	transform-origin: 120px 300px;
	animation: anchor-pop 4s infinite cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.6s;
}

@keyframes anchor-pop {
	0% {
		transform: scale(0);
	}
	15%, 85% {
		transform: scale(1);
	}
	95%, 100% {
		transform: scale(0);
	}
}

/* Planning & R&D Animation for Stage 1 (Plan) */
.planning-anim-group {
	opacity: 0;
	transition: opacity 0.6s cubic-bezier(0.4, 0, 0.2, 1);
	pointer-events: none;
}
.process-loop-container.active-step-1 .planning-anim-group {
	opacity: 1;
}

/* Gear Rotations and Origins */
.gear-large {
	transform-origin: 190px 170px;
}
.process-loop-container.active-step-1 .gear-large {
	animation: gear-spin-clockwise 12s infinite linear;
}

.gear-medium {
	transform-origin: 254px 218px;
}
.process-loop-container.active-step-1 .gear-medium {
	animation: gear-spin-counter-clockwise 9s infinite linear;
}

.gear-small {
	transform-origin: 292px 185px;
}
.process-loop-container.active-step-1 .gear-small {
	animation: gear-spin-clockwise 6s infinite linear;
}

.gear-teeth {
	opacity: 0.8;
}
.gear-rim {
	opacity: 0.5;
}
.gear-core {
	opacity: 0.9;
}

@keyframes gear-spin-clockwise {
	from { transform: rotate(0deg); }
	to { transform: rotate(360deg); }
}

@keyframes gear-spin-counter-clockwise {
	from { transform: rotate(0deg); }
	to { transform: rotate(-360deg); }
}

/* Flowchart Nodes */
.plan-node {
	fill: var(--step-1-color);
	filter: drop-shadow(0 0 3px var(--step-1-color));
}
.plan-node-pulse {
	fill: none;
	stroke: var(--step-1-color);
	stroke-width: 1.5px;
	opacity: 0;
}

.process-loop-container.active-step-1 .node-a-pulse {
	transform-origin: 130px 260px;
	animation: plan-node-glow 3s infinite ease-in-out;
}
.process-loop-container.active-step-1 .node-b-pulse {
	transform-origin: 350px 270px;
	animation: plan-node-glow 3s infinite ease-in-out 1s;
}
.process-loop-container.active-step-1 .node-c-pulse {
	transform-origin: 310px 100px;
	animation: plan-node-glow 3s infinite ease-in-out 2s;
}

@keyframes plan-node-glow {
	0% {
		transform: scale(0.5);
		opacity: 0;
	}
	50% {
		opacity: 0.7;
	}
	100% {
		transform: scale(2);
		opacity: 0;
	}
}






/* Responsive design */
@media (max-width: 1024px) {
	.codentricks-software-hero-grid {
		grid-template-columns: 1fr;
		gap: 60px;
		text-align: center;
	}
	.hero-animation-col {
		order: -1;
	}
	.hero-content-col {
		align-items: center;
	}
	.hero-title {
		font-size: 38px;
	}
}

@media (max-width: 640px) {
	.codentricks-software-hero-wrapper {
		padding: 60px 0;
	}
	.hero-title {
		font-size: 32px;
	}
	.hero-description {
		font-size: 15px;
	}
	.hero-buttons-wrapper {
		flex-direction: column;
		width: 100%;
		gap: 12px;
	}
	.codentricks-btn {
		width: 100%;
	}
	.process-loop-container {
		max-width: 400px;
	}
}



/* ==========================================================================
   15. CT CONTACT FORM WIDGET
   ========================================================================== */
.ct-contact-form-container {
	width: 100%;
	display: block;
	box-sizing: border-box;
}

.ct-contact-form-card {
	background-color: #ffffff;
	border: 1px solid #f1f5f9;
	border-radius: 16px;
	padding: 40px;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.03);
	position: relative;
	overflow: hidden;
	box-sizing: border-box;
	transition: all 0.3s ease;
}

.ct-contact-form-card::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 5px;
	background: linear-gradient(90deg, #f97316 0%, #db2777 100%);
	z-index: 10;
}

.ct-contact-form-header {
	margin-bottom: 30px;
	box-sizing: border-box;
}

.ct-contact-form-title {
	font-family: 'Plus Jakarta Sans', sans-serif !important;
	font-size: 28px !important;
	font-weight: 800 !important;
	color: #0f172a !important;
	margin: 0 0 10px 0 !important;
	line-height: 1.25 !important;
	letter-spacing: -0.5px !important;
}

.ct-contact-form-subtitle {
	font-family: 'Inter', sans-serif !important;
	font-size: 14px !important;
	line-height: 1.6 !important;
	color: #475569 !important;
	margin: 0 !important;
}

.ct-form-row {
	display: flex;
	flex-wrap: wrap;
	margin-left: -12px;
	margin-right: -12px;
	box-sizing: border-box;
}

.ct-form-group {
	display: flex;
	flex-direction: column;
	padding-left: 12px;
	padding-right: 12px;
	margin-bottom: 24px;
	box-sizing: border-box;
}

.col-width-50 {
	width: 50%;
}

.col-width-100 {
	width: 100%;
}

@media (max-width: 767px) {
	.col-width-50 {
		width: 100%;
	}
	.ct-contact-form-card {
		padding: 30px 20px;
	}
	.ct-contact-form-title {
		font-size: 24px !important;
	}
}

.ct-form-group label {
	font-family: 'Plus Jakarta Sans', sans-serif !important;
	font-size: 11px !important;
	font-weight: 800 !important;
	text-transform: uppercase !important;
	color: #1f2937 !important;
	margin-bottom: 8px !important;
	letter-spacing: 0.8px !important;
	line-height: 1.4 !important;
	display: inline-block;
}

.required-asterisk {
	color: #ef4444;
	margin-left: 3px;
	font-weight: 900;
}

.ct-form-control {
	font-family: 'Inter', sans-serif !important;
	font-size: 14px !important;
	border: 1px solid #e2e8f0 !important;
	border-radius: 8px !important;
	background-color: #f8fafc !important;
	padding: 12px 16px !important;
	color: #0f172a !important;
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
	box-sizing: border-box !important;
	width: 100% !important;
	outline: none !important;
}

.ct-form-control::placeholder {
	color: #94a3b8 !important;
	opacity: 0.85;
}

.ct-form-control:focus {
	border-color: #db2777 !important;
	background-color: #ffffff !important;
	box-shadow: 0 0 0 3px rgba(219, 39, 119, 0.12) !important;
}

textarea.ct-form-control {
	resize: vertical;
	min-height: 120px;
	line-height: 1.6;
}

select.ct-form-control {
	appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%23475569'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 9l-7 7-7-7'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 16px center;
	background-size: 16px;
	padding-right: 40px !important;
}

/* Custom premium radio button styling */
.ct-radio-group-wrapper {
	display: flex;
	flex-direction: column;
	gap: 12px;
	margin-top: 6px;
	box-sizing: border-box;
}

.ct-radio-container {
	display: flex;
	align-items: center;
	position: relative;
	padding-left: 28px;
	cursor: pointer;
	font-family: 'Inter', sans-serif !important;
	font-size: 14px !important;
	font-weight: 500 !important;
	color: #334155 !important;
	user-select: none;
	min-height: 20px;
	box-sizing: border-box;
}

.ct-radio-container input {
	position: absolute;
	opacity: 0;
	cursor: pointer;
	height: 0;
	width: 0;
}

.ct-radio-checkmark {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	left: 0;
	height: 18px;
	width: 18px;
	background-color: #f8fafc;
	border: 1px solid #cbd5e1;
	border-radius: 50%;
	transition: all 0.25s ease;
	box-sizing: border-box;
}

.ct-radio-container:hover input ~ .ct-radio-checkmark {
	border-color: #db2777;
}

.ct-radio-container input:checked ~ .ct-radio-checkmark {
	background-color: #db2777;
	border-color: #db2777;
}

.ct-radio-checkmark::after {
	content: "";
	position: absolute;
	display: none;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #ffffff;
}

.ct-radio-container input:checked ~ .ct-radio-checkmark::after {
	display: block;
}

/* Form Validation Styling */
.error-msg {
	display: none;
	align-items: center;
	gap: 6px;
	font-family: 'Inter', sans-serif !important;
	font-size: 11px !important;
	font-weight: 700 !important;
	color: #ef4444 !important;
	margin-top: 8px;
	box-sizing: border-box;
}

.has-validation-error .error-msg {
	display: flex;
}

.has-validation-error .ct-form-control,
.ct-form-control.user-invalid-fallback {
	border-color: #ef4444 !important;
	background-color: #fff5f5 !important;
}

.has-validation-error .ct-form-control:focus,
.ct-form-control.user-invalid-fallback:focus {
	box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.12) !important;
}

/* Google reCAPTCHA Integration */
.ct-recaptcha-wrapper {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
	box-sizing: border-box;
}

.ct-g-recaptcha {
	min-height: 78px;
	box-sizing: border-box;
}

.has-validation-error .ct-g-recaptcha {
	border: 1px dashed #ef4444;
	border-radius: 6px;
	padding: 6px;
	background-color: #fff5f5;
}

@media (max-width: 380px) {
	.ct-g-recaptcha {
		transform: scale(0.85);
		transform-origin: 0 0;
	}
}

/* Feedback/Alert banners */
.ct-feedback-wrapper {
	margin-bottom: 0px !important;
}

.ct-form-alert {
	display: none;
	align-items: center;
	gap: 14px;
	padding: 16px 20px;
	border-radius: 8px;
	font-family: 'Inter', sans-serif !important;
	font-size: 13.5px !important;
	font-weight: 600 !important;
	line-height: 1.5 !important;
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	margin-bottom: 24px;
	box-sizing: border-box;
}

.ct-form-alert.show {
	display: flex;
	animation: ctSlideDown 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

@keyframes ctSlideDown {
	from {
		opacity: 0;
		transform: translateY(-10px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.alert-success {
	background-color: #f0fdf4;
	border: 1px solid #bbf7d0;
	color: #15803d;
}

.alert-error {
	background-color: #fef2f2;
	border: 1px solid #fee2e2;
	color: #b91c1c;
}

.ct-form-alert .alert-icon {
	font-size: 14px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	background: currentColor;
	color: #ffffff !important;
	font-weight: bold;
	flex-shrink: 0;
}

.alert-success .alert-icon {
	background-color: #15803d !important;
}

.alert-error .alert-icon {
	background-color: #b91c1c !important;
}

/* Submit Button & Animations */
.ct-contact-submit-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	width: 100%;
	border: none;
	padding: 15px 30px;
	font-family: 'Plus Jakarta Sans', sans-serif !important;
	font-size: 14px !important;
	font-weight: 800 !important;
	color: #ffffff;
	border-radius: 8px;
	cursor: pointer;
	box-shadow: 0 4px 15px rgba(219, 39, 119, 0.2);
	outline: none;
	box-sizing: border-box;
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.ct-contact-submit-btn:hover {
	transform: translateY(-2px);
	box-shadow: 0 8px 25px rgba(219, 39, 119, 0.35);
	filter: brightness(1.05);
}

.ct-contact-submit-btn:active {
	transform: translateY(0);
}

.ct-contact-submit-btn:disabled {
	opacity: 0.85;
	cursor: not-allowed;
	transform: none !important;
	box-shadow: none !important;
}

.btn-spinner {
	display: none;
	width: 18px;
	height: 18px;
	border: 2.5px solid rgba(255, 255, 255, 0.35);
	border-radius: 50%;
	border-top-color: #ffffff;
	animation: ctSpin 0.75s linear infinite;
	box-sizing: border-box;
	flex-shrink: 0;
}

.btn-loading .btn-spinner {
	display: inline-block;
}

.btn-loading .btn-label-text {
	opacity: 0.9;
}

@keyframes ctSpin {
	to {
		transform: rotate(360deg);
	}
}

/* ==========================================================================
   12. WhatsApp Wholesale Widget
   ========================================================================== */
.codentricks-wa-wholesale-container {
	display: flex !important;
	justify-content: center !important;
	align-items: center !important;
	width: 100% !important;
	box-sizing: border-box !important;
	background: transparent !important;
	padding: 20px 0 !important;
}

.codentricks-wa-wholesale-card {
	position: relative !important;
	background: #ffffff !important;
	border-radius: 16px !important;
	padding: 40px !important;
	box-shadow: 0 10px 40px rgba(0, 0, 0, 0.04) !important;
	border: 1px solid rgba(0, 0, 0, 0.03) !important;
	box-sizing: border-box !important;
	width: 100% !important;
	max-width: 800px !important;
	overflow: hidden !important;
}

.codentricks-wa-wholesale-card::before {
	content: "" !important;
	position: absolute !important;
	top: 0 !important;
	left: 0 !important;
	right: 0 !important;
	height: 4px !important;
	background: linear-gradient(90deg, #ff9800 0%, #e91e63 100%) !important;
	z-index: 1 !important;
}

/* Guarantees Box Styling */
.codentricks-wa-wholesale-guarantees {
	background-color: #fff5f5 !important;
	border: 1px solid #fee2e2 !important;
	border-left: 4px solid #f87171 !important;
	border-radius: 12px !important;
	padding: 20px 24px !important;
	margin-bottom: 30px !important;
	text-align: left !important;
	box-sizing: border-box !important;
}

.codentricks-wa-wholesale-guarantees-title {
	font-family: 'Plus Jakarta Sans', sans-serif !important;
	font-size: 13px !important;
	font-weight: 800 !important;
	color: #991b1b !important;
	margin: 0 0 10px 0 !important;
	letter-spacing: 0.5px !important;
	text-transform: uppercase !important;
}

.codentricks-wa-wholesale-guarantees-list {
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
	display: flex !important;
	flex-direction: column !important;
	gap: 8px !important;
}

.codentricks-wa-wholesale-guarantees-list li {
	font-family: 'Inter', sans-serif !important;
	font-size: 13.5px !important;
	line-height: 1.5 !important;
	color: #991b1b !important;
	display: flex !important;
	align-items: flex-start !important;
	gap: 6px !important;
}

.codentricks-wa-wholesale-guarantees-list li .item-num {
	font-weight: bold !important;
	flex-shrink: 0 !important;
}

/* Form Rows and Groups */
.codentricks-wa-wholesale-row {
	display: flex !important;
	flex-wrap: wrap !important;
	gap: 20px 24px !important;
	width: 100% !important;
	box-sizing: border-box !important;
}

.codentricks-wa-wholesale-row .wa-form-group {
	display: flex !important;
	flex-direction: column !important;
	gap: 8px !important;
	box-sizing: border-box !important;
	margin-bottom: 0 !important;
}

.codentricks-wa-wholesale-row .wa-form-group.col-width-50 {
	width: calc(50% - 12px) !important;
}

.codentricks-wa-wholesale-row .wa-form-group.col-width-100 {
	width: 100% !important;
}

@media (max-width: 768px) {
	.codentricks-wa-wholesale-row .wa-form-group.col-width-50 {
		width: 100% !important;
	}
	.codentricks-wa-wholesale-card {
		padding: 30px 20px !important;
	}
}

/* Form Select & Radio enhancements */
.codentricks-wa-wholesale-row select.wa-form-control {
	appearance: none !important;
	background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234b5563' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E") !important;
	background-repeat: no-repeat !important;
	background-position: right 16px center !important;
	background-size: 16px !important;
	padding-right: 40px !important;
}

/* Radio Button Custom Styling */
.codentricks-wa-wholesale-row .ct-radio-group-wrapper {
	display: flex !important;
	flex-wrap: wrap !important;
	gap: 12px 20px !important;
	padding: 6px 0 !important;
}

.codentricks-wa-wholesale-row .ct-radio-container {
	position: relative !important;
	display: inline-flex !important;
	align-items: center !important;
	cursor: pointer !important;
	font-family: 'Inter', sans-serif !important;
	font-size: 13.5px !important;
	color: #374151 !important;
	user-select: none !important;
	gap: 8px !important;
}

.codentricks-wa-wholesale-row .ct-radio-container input {
	position: absolute !important;
	opacity: 0 !important;
	cursor: pointer !important;
	height: 0 !important;
	width: 0 !important;
}

.codentricks-wa-wholesale-row .ct-radio-checkmark {
	height: 18px !important;
	width: 18px !important;
	background-color: #f3f4f6 !important;
	border: 1px solid #d1d5db !important;
	border-radius: 50% !important;
	transition: all 0.2s ease !important;
	display: inline-block !important;
	flex-shrink: 0 !important;
	position: relative !important;
}

.codentricks-wa-wholesale-row .ct-radio-container:hover input ~ .ct-radio-checkmark {
	background-color: #e5e7eb !important;
}

.codentricks-wa-wholesale-row .ct-radio-container input:checked ~ .ct-radio-checkmark {
	background-color: #e91e63 !important;
	border-color: #e91e63 !important;
}

.codentricks-wa-wholesale-row .ct-radio-checkmark::after {
	content: "" !important;
	position: absolute !important;
	display: none !important;
	top: 5px !important;
	left: 5px !important;
	width: 6px !important;
	height: 6px !important;
	border-radius: 50% !important;
	background: white !important;
}

.codentricks-wa-wholesale-row .ct-radio-container input:checked ~ .ct-radio-checkmark::after {
	display: block !important;
}

/* Form Note / Subtext below Button */
.codentricks-wa-wholesale-note {
	font-family: 'Inter', sans-serif !important;
	font-size: 12px !important;
	line-height: 1.5 !important;
	color: #6b7280 !important;
	text-align: center !important;
	margin-top: 12px !important;
}

/* Submit Button loading state spinner styling */
.codentricks-wa-submit-btn .btn-spinner {
	display: none;
	width: 18px;
	height: 18px;
	border: 2px solid rgba(255, 255, 255, 0.3);
	border-radius: 50%;
	border-top-color: #ffffff;
	animation: ctSpin 0.75s linear infinite;
	box-sizing: border-box;
	flex-shrink: 0;
}

.codentricks-wa-submit-btn.btn-loading .btn-spinner {
	display: inline-block !important;
}

.codentricks-wa-submit-btn.btn-loading .wa-btn-svg {
	display: none !important;
}

/* ==========================================================================
   12. WOOCOMMERCE WHATSAPP MODE - SPECIFICATIONS POPUP MODAL
   ========================================================================== */
.codentricks-specs-modal-overlay {
	position: fixed !important;
	top: 0 !important;
	left: 0 !important;
	width: 100% !important;
	height: 100% !important;
	z-index: 999999 !important;
	background: rgba(15, 23, 42, 0.7) !important;
	backdrop-filter: blur(16px) !important;
	-webkit-backdrop-filter: blur(16px) !important;
	display: flex !important;
	align-items: stretch !important;
	justify-content: flex-start !important;
	opacity: 0 !important;
	pointer-events: none !important;
	transition: opacity 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important;
	padding: 0 !important;
	box-sizing: border-box !important;
}

.codentricks-specs-modal-overlay.open {
	opacity: 1 !important;
	pointer-events: auto !important;
}

.codentricks-specs-modal-wrapper {
	background: #0f172a !important; /* Premium dark theme background */
	border-right: 1px solid rgba(255, 255, 255, 0.1) !important;
	border-top: none !important;
	border-bottom: none !important;
	border-left: none !important;
	border-radius: 0 24px 24px 0 !important;
	width: 100% !important;
	max-width: 480px !important;
	height: 100vh !important;
	max-height: 100vh !important;
	overflow-y: auto !important;
	position: relative !important;
	transform: translateX(-100%) !important; /* Start off-screen left */
	transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1) !important;
	box-shadow: 20px 0 50px rgba(0, 0, 0, 0.6) !important;
	box-sizing: border-box !important;
}

/* Custom premium scrollbar for modal details */
.codentricks-specs-modal-wrapper::-webkit-scrollbar {
	width: 8px !important;
}
.codentricks-specs-modal-wrapper::-webkit-scrollbar-track {
	background: rgba(255, 255, 255, 0.03) !important;
	border-radius: 10px !important;
}
.codentricks-specs-modal-wrapper::-webkit-scrollbar-thumb {
	background: rgba(255, 255, 255, 0.15) !important;
	border-radius: 10px !important;
}
.codentricks-specs-modal-wrapper::-webkit-scrollbar-thumb:hover {
	background: rgba(255, 255, 255, 0.25) !important;
}

.codentricks-specs-modal-overlay.open .codentricks-specs-modal-wrapper {
	transform: translateX(0) !important; /* Slide in to left boundary */
}

.codentricks-specs-modal-close {
	position: absolute !important;
	top: 20px !important;
	right: 20px !important;
	width: 38px !important;
	height: 38px !important;
	border-radius: 50% !important;
	background: rgba(255, 255, 255, 0.05) !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	color: #ffffff !important;
	font-size: 24px !important;
	font-weight: 300 !important;
	cursor: pointer !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
	z-index: 100 !important;
	line-height: 1 !important;
	padding: 0 0 4px 0 !important;
}

.codentricks-specs-modal-close:hover {
	background: #ef4444 !important; /* Premium red close hover */
	border-color: #ef4444 !important;
	transform: rotate(90deg) !important;
}

.codentricks-specs-modal-grid {
	display: flex !important;
	flex-direction: column !important;
	gap: 32px !important;
	padding: 64px 32px 40px 32px !important;
	box-sizing: border-box !important;
}

@media (max-width: 768px) {
	.codentricks-specs-modal-grid {
		display: flex !important;
		flex-direction: column !important;
		padding: 40px 24px !important;
		gap: 24px !important;
	}
	.codentricks-specs-modal-close {
		top: 15px !important;
		right: 15px !important;
	}
}

@media (max-width: 480px) {
	.codentricks-specs-modal-wrapper {
		border-radius: 0 !important;
	}
}

/* Badge pills in modal */
.modal-left-col .modal-badges .pill-badge {
	font-family: 'Inter', sans-serif !important;
	font-size: 11px !important;
	font-weight: 700 !important;
	padding: 6px 12px !important;
	border-radius: 6px !important;
	display: inline-block !important;
	width: fit-content !important;
}

.modal-left-col .modal-badges .pill-moq {
	background: rgba(16, 185, 129, 0.15) !important;
	color: #34d399 !important;
}

.modal-left-col .modal-badges .pill-pack {
	background: rgba(245, 158, 11, 0.15) !important;
	color: #fbbf24 !important;
}

/* Image container */
.modal-left-col .modal-img-wrap {
	width: 100% !important;
	border-radius: 16px !important;
	overflow: hidden !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	aspect-ratio: 1 / 1 !important;
	background: rgba(255, 255, 255, 0.02) !important;
}

.modal-left-col .modal-img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
	display: block !important;
}

/* WhatsApp Inquiry Button inside Modal */
.modal-left-col .modal-wa-btn {
	background: #00a884 !important; /* Premium WhatsApp Green */
	color: #ffffff !important;
	font-family: 'Plus Jakarta Sans', sans-serif !important;
	font-size: 14px !important;
	font-weight: 800 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.5px !important;
	text-decoration: none !important;
	padding: 16px 20px !important;
	border-radius: 12px !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 8px !important;
	width: 100% !important;
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
	box-shadow: 0 4px 15px rgba(0, 168, 132, 0.35) !important;
	cursor: pointer !important;
	box-sizing: border-box !important;
}

.modal-left-col .modal-wa-btn:hover {
	background: #008f6f !important;
	transform: translateY(-2px) !important;
	box-shadow: 0 8px 22px rgba(0, 168, 132, 0.5) !important;
}

.modal-left-col .modal-wa-btn svg {
	fill: currentColor !important;
}

/* Category pill inside modal */
.modal-right-col .modal-cat {
	font-family: 'Plus Jakarta Sans', sans-serif !important;
	font-size: 11px !important;
	font-weight: 800 !important;
	color: #f59e0b !important; /* Golden amber */
	text-transform: uppercase !important;
	letter-spacing: 1px !important;
	margin-bottom: 12px !important;
	display: block !important;
}

/* Title inside modal */
.modal-right-col .modal-title {
	font-family: 'Plus Jakarta Sans', sans-serif !important;
	font-size: 32px !important;
	font-weight: 800 !important;
	color: #ffffff !important;
	line-height: 1.2 !important;
	margin: 0 0 16px 0 !important;
	letter-spacing: -0.5px !important;
}

/* Description inside modal */
.modal-right-col .modal-desc {
	font-family: 'Inter', sans-serif !important;
	font-size: 14.5px !important;
	line-height: 1.6 !important;
	color: rgba(255, 255, 255, 0.75) !important;
	margin: 0 0 32px 0 !important;
}

/* Specs list section */
.modal-right-col .modal-specs-section .specs-title {
	font-family: 'Plus Jakarta Sans', sans-serif !important;
	font-size: 13px !important;
	font-weight: 800 !important;
	color: #ffffff !important;
	text-transform: uppercase !important;
	letter-spacing: 1px !important;
	margin: 0 0 12px 0 !important;
	padding-bottom: 8px !important;
	border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
}

.modal-right-col .codentricks-specs-table {
	width: 100% !important;
	border-collapse: collapse !important;
	margin: 0 !important;
	padding: 0 !important;
}

.modal-right-col .codentricks-specs-table tr {
	border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
}

.modal-right-col .codentricks-specs-table tr:last-child {
	border-bottom: none !important;
}

.modal-right-col .codentricks-specs-table td {
	padding: 10px 0 !important;
	font-family: 'Inter', sans-serif !important;
	font-size: 13.5px !important;
	color: rgba(255, 255, 255, 0.7) !important;
	vertical-align: top !important;
}

.modal-right-col .codentricks-specs-table td.label-cell {
	font-weight: 700 !important;
	color: #ffffff !important;
	width: 32% !important;
	padding-right: 15px !important;
}

/* Symmetric Grid Layout (Left to Right Columns) */
.codentricks-blog-section-grid.layout-grid {
	display: grid !important;
	grid-template-columns: repeat(4, 1fr) !important;
	gap: 30px !important;
}

@media (max-width: 1024px) {
	.codentricks-blog-section-grid.layout-grid {
		grid-template-columns: repeat(2, 1fr) !important;
		gap: 24px !important;
	}
}

@media (max-width: 640px) {
	.codentricks-blog-section-grid.layout-grid {
		grid-template-columns: 1fr !important;
	}
}

/* Grid Card Styles */
.blog-grid-card {
	display: flex !important;
	flex-direction: column !important;
	background: rgba(255, 255, 255, 0.01) !important;
	border: 1px solid rgba(255, 255, 255, 0.04) !important;
	border-radius: 20px !important;
	overflow: hidden !important;
	transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important;
	box-sizing: border-box !important;
	animation: ctBlogFadeInUp 0.8s cubic-bezier(0.16, 1, 0.3, 1) both;
}

.blog-grid-card:nth-child(1) { animation-delay: 0.1s !important; }
.blog-grid-card:nth-child(2) { animation-delay: 0.2s !important; }
.blog-grid-card:nth-child(3) { animation-delay: 0.3s !important; }
.blog-grid-card:nth-child(4) { animation-delay: 0.4s !important; }

.theme-light .blog-grid-card {
	background: #ffffff !important;
	border-color: rgba(0, 0, 0, 0.05) !important;
	box-shadow: 0 8px 30px rgba(0, 0, 0, 0.02) !important;
}

.blog-grid-card:hover {
	transform: translateY(-6px) !important;
	box-shadow: 0 16px 40px rgba(0, 0, 0, 0.25) !important;
	border-color: rgba(59, 130, 246, 0.2) !important;
}
.theme-light .blog-grid-card:hover {
	box-shadow: 0 16px 40px rgba(0, 0, 0, 0.04) !important;
	border-color: rgba(59, 130, 246, 0.15) !important;
}

.grid-image-wrapper {
	position: relative !important;
	width: 100% !important;
	aspect-ratio: 16 / 10 !important;
	overflow: hidden !important;
	background: #000000 !important;
}

.grid-img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
	display: block !important;
	transition: transform 0.8s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.4s ease !important;
}

.blog-grid-card:hover .grid-img {
	transform: scale(1.06) rotate(0.5deg) !important;
	opacity: 0.85 !important;
}

.grid-content {
	padding: 24px !important;
	display: flex !important;
	flex-direction: column !important;
	flex-grow: 1 !important;
	box-sizing: border-box !important;
}

.grid-title {
	font-family: 'Plus Jakarta Sans', sans-serif !important;
	font-size: 17px !important;
	font-weight: 800 !important;
	line-height: 1.4 !important;
	margin: 0 0 14px 0 !important;
	letter-spacing: -0.3px !important;
}

.theme-dark .grid-title a {
	color: #ffffff !important;
}
.theme-light .grid-title a {
	color: #0f172a !important;
}

.grid-title a:hover {
	color: inherit !important;
}

.grid-excerpt {
	font-family: 'Inter', sans-serif !important;
	font-size: 13.5px !important;
	line-height: 1.6 !important;
	color: rgba(255, 255, 255, 0.65) !important;
	margin: 0 0 20px 0 !important;
}

.theme-light .grid-excerpt {
	color: #4b5563 !important;
}

/* ==========================================================================
   13. CT Why Us Widget
   ========================================================================== */
.ct-why-us-container {
	width: 100%;
	box-sizing: border-box;
}

.ct-why-us-row {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	align-items: center;
	width: 100%;
	box-sizing: border-box;
}

.ct-dir-image_left {
	grid-template-areas: "image content";
}

.ct-dir-image_right {
	grid-template-areas: "content image";
}

.ct-why-us-col-image {
	grid-area: image;
	width: 100%;
	height: 100%;
	box-sizing: border-box;
}

.ct-why-us-col-content {
	grid-area: content;
	width: 100%;
	height: 100%;
	box-sizing: border-box;
}

.ct-why-us-img-wrapper {
	position: relative;
	overflow: hidden;
	width: 100%;
	height: 100%;
	min-height: 450px;
	box-shadow: 0 20px 45px rgba(0, 0, 0, 0.08);
	box-sizing: border-box;
	display: flex;
}

.ct-why-us-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	min-height: 450px;
	transition: transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

.ct-why-us-img-wrapper:hover .ct-why-us-img {
	transform: scale(1.04);
}

/* Overlay Glassmorphic Card */
.ct-why-us-overlay-card {
	position: absolute;
	padding: 24px 28px;
	border-radius: 16px;
	border: 1px solid rgba(255, 255, 255, 0.12);
	box-sizing: border-box;
	max-width: 85%;
	z-index: 10;
	display: flex;
	flex-direction: column;
	gap: 6px;
	box-shadow: 0 12px 35px rgba(0, 0, 0, 0.25);
	text-align: left;
	transition: all 0.3s ease;
}

.ct-why-us-overlay-card:hover {
	transform: translateY(-2px);
	box-shadow: 0 16px 40px rgba(0, 0, 0, 0.35);
}

/* Overlay Card Positions */
.ct-why-us-overlay-card.ct-pos-bottom-left {
	left: 24px;
	bottom: 24px;
}

.ct-why-us-overlay-card.ct-pos-bottom-right {
	right: 24px;
	bottom: 24px;
}

.ct-why-us-overlay-card.ct-pos-top-left {
	left: 24px;
	top: 24px;
}

.ct-why-us-overlay-card.ct-pos-top-right {
	right: 24px;
	top: 24px;
}

.ct-why-us-overlay-card.ct-pos-bottom-center {
	left: 50%;
	bottom: 24px;
	transform: translateX(-50%);
}
.ct-why-us-overlay-card.ct-pos-bottom-center:hover {
	transform: translate(-50%, -2px);
}

.ct-why-us-overlay-subtitle {
	font-family: 'Plus Jakarta Sans', sans-serif !important;
	font-size: 13px !important;
	font-weight: 800 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.5px !important;
	margin: 0 !important;
}

.ct-why-us-overlay-desc {
	font-family: 'Inter', sans-serif !important;
	font-size: 13px !important;
	line-height: 1.55 !important;
	margin: 0 !important;
	font-weight: 500 !important;
}

/* Right Content Area styling */
.ct-why-us-content-inner {
	display: flex;
	flex-direction: column;
	justify-content: center;
	height: 100%;
	text-align: left;
}

.ct-why-us-accent {
	font-family: 'Plus Jakarta Sans', sans-serif !important;
	font-size: 12px !important;
	font-weight: 800 !important;
	letter-spacing: 1.5px !important;
	text-transform: uppercase !important;
	margin-bottom: 12px;
	display: inline-block;
}

.ct-why-us-heading {
	font-family: 'Plus Jakarta Sans', sans-serif !important;
	font-size: 36px !important;
	font-weight: 800 !important;
	line-height: 1.25 !important;
	margin: 0 0 20px 0 !important;
	letter-spacing: -0.8px !important;
}

.ct-why-us-description {
	font-family: 'Inter', sans-serif !important;
	font-size: 14.5px !important;
	line-height: 1.65 !important;
	margin: 0 0 32px 0 !important;
}

/* Features Grid */
.ct-why-us-features-grid {
	display: grid;
	column-gap: 30px;
	row-gap: 24px;
	width: 100%;
	box-sizing: border-box;
}

.ct-why-us-feature-item {
	display: flex;
	flex-direction: column;
	gap: 6px;
	box-sizing: border-box;
	transition: transform 0.3s ease;
}

.ct-why-us-feature-item:hover {
	transform: translateY(-2px);
}

.ct-why-us-feature-header {
	display: flex;
	align-items: flex-start;
	gap: 10px;
}

.ct-why-us-feature-icon-wrapper {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	margin-top: 3px;
	font-size: 14px;
	transition: transform 0.3s ease;
}

.ct-why-us-feature-icon-wrapper svg,
.ct-why-us-feature-icon-wrapper i {
	display: block;
}

.ct-why-us-feature-item:hover .ct-why-us-feature-icon-wrapper {
	transform: scale(1.2);
}

.ct-why-us-feature-title {
	font-family: 'Plus Jakarta Sans', sans-serif !important;
	font-size: 16px !important;
	font-weight: 700 !important;
	line-height: 1.35 !important;
	margin: 0 !important;
}

.ct-why-us-feature-desc {
	font-family: 'Inter', sans-serif !important;
	font-size: 13.5px !important;
	line-height: 1.55 !important;
	margin: 0 !important;
	padding-left: 24px; /* Icon width + gap alignment */
}

/* Responsive Overrides */
@media (max-width: 1024px) {
	.ct-why-us-row {
		grid-template-columns: 1fr !important;
		grid-template-areas: "image" "content" !important;
	}
	
	.ct-why-us-img-wrapper {
		min-height: 380px;
	}
	
	.ct-why-us-img {
		min-height: 380px;
	}

	.ct-why-us-heading {
		font-size: 30px !important;
	}
}

@media (max-width: 768px) {
	.ct-why-us-img-wrapper {
		min-height: 300px;
	}
	
	.ct-why-us-img {
		min-height: 300px;
	}
	
	.ct-why-us-overlay-card {
		max-width: 90%;
		padding: 16px 20px;
	}
	
	.ct-why-us-overlay-subtitle {
		font-size: 12px !important;
	}
	
	.ct-why-us-overlay-desc {
		font-size: 12px !important;
	}
}

/* ==========================================================================
   14. CT  HERO SHORT WIDGET
   ========================================================================== */
.codentricks-hero-short-wrapper {
	padding: 40px 0;
	width: 100%;
}

.codentricks-hero-short-card {
	position: relative;
	background: #070913;
	border: 1px solid rgba(255, 255, 255, 0.08);
	border-radius: 24px;
	padding: 60px 50px;
	overflow: hidden;
	box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5);
	font-family: 'Outfit', sans-serif;
}

/* Cyber grid background inside the card */
.hero-short-grid-bg {
	position: absolute;
	inset: 0;
	background-image: 
		linear-gradient(rgba(255, 255, 255, 0.015) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255, 255, 255, 0.015) 1px, transparent 1px);
	background-size: 40px 40px;
	background-position: center center;
	pointer-events: none;
	z-index: 1;
}

/* Glowing background blur blob */
.hero-short-glow-blob {
	position: absolute;
	top: -50px;
	right: 10%;
	width: 300px;
	height: 300px;
	background: radial-gradient(circle, rgba(59, 130, 246, 0.15) 0%, rgba(168, 85, 247, 0.1) 50%, transparent 100%);
	filter: blur(60px);
	pointer-events: none;
	z-index: 1;
	animation: hero-short-float-blob 15s infinite alternate ease-in-out;
}

@keyframes hero-short-float-blob {
	0% { transform: translate(0, 0) scale(1); }
	100% { transform: translate(-50px, 40px) scale(1.2); }
}

.hero-short-content {
	position: relative;
	z-index: 2;
	max-width: 800px;
}

/* Badge styled like the reference image */
.hero-short-badge {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: rgba(59, 130, 246, 0.06);
	border: 1px solid rgba(59, 130, 246, 0.25);
	padding: 6px 16px;
	border-radius: 50px;
	margin-bottom: 24px;
	box-shadow: 0 0 15px rgba(59, 130, 246, 0.05);
}

.hero-short-badge .badge-dot {
	width: 6px;
	height: 6px;
	background-color: #06b6d4;
	border-radius: 50%;
	display: inline-block;
	box-shadow: 0 0 8px #06b6d4, 0 0 15px #06b6d4;
	animation: hero-short-pulse-dot 1.5s infinite ease-in-out;
}

@keyframes hero-short-pulse-dot {
	0%, 100% { opacity: 0.5; transform: scale(0.9); }
	50% { opacity: 1; transform: scale(1.2); }
}

.hero-short-badge .badge-text {
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 1.5px;
	color: #93c5fd;
}

/* Animating Gradient Title */
.hero-short-title {
	font-size: 40px;
	font-size: clamp(1.8rem, 3.5vw, 2.8rem);
	font-weight: 800;
	line-height: 1.25;
	margin: 0 0 20px 0;
	letter-spacing: -0.5px;
	color: #ffffff;
	/* Base gradient text properties using CSS variables */
	background: linear-gradient(120deg, 
		var(--title-grad-1, #ffffff) 0%, 
		var(--title-grad-1, #ffffff) 40%, 
		var(--title-grad-2, #00f2fe) 65%, 
		var(--title-grad-3, #a855f7) 85%, 
		var(--title-grad-1, #ffffff) 100%);
	background-size: 200% auto;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent !important;
	animation: hero-short-title-gradient 8s linear infinite;
}

@keyframes hero-short-title-gradient {
	0% { background-position: 0% center; }
	100% { background-position: -200% center; }
}

/* Description Text */
.hero-short-desc {
	font-family: 'Inter', sans-serif;
	font-size: 16px;
	line-height: 1.65;
	color: #94a3b8;
	margin: 0;
}

/* Responsive Overrides */
@media (max-width: 768px) {
	.codentricks-hero-short-card {
		padding: 40px 30px;
		border-radius: 16px;
	}
	.hero-short-title {
		margin-bottom: 16px;
	}
	.hero-short-desc {
		font-size: 14px;
	}
}

/* ==========================================================================
   15. CT  INTEGRATIONS GRID WIDGET
   ========================================================================== */
.codentricks-integrations-grid-wrapper {
	width: 100%;
	padding: 40px 0;
	font-family: 'Outfit', sans-serif;
}

.ct-integrations-main-title {
	font-size: 36px;
	font-size: clamp(1.8rem, 3.5vw, 2.5rem);
	font-weight: 800;
	line-height: 1.25;
	margin: 0;
	letter-spacing: -0.5px;
	color: #ffffff;
}

.ct-integrations-main-desc {
	font-family: 'Inter', sans-serif;
	font-size: 16px;
	line-height: 1.6;
	color: #94a3b8;
	margin: 16px auto 0 auto;
	max-width: 800px;
}

/* Grid Layout */
.ct-integrations-grid-container {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 30px;
	width: 100%;
}

/* Integration Card */
.ct-integration-card {
	position: relative;
	background-color: rgba(255, 255, 255, 0.03);
	border: 1px solid rgba(255, 255, 255, 0.05);
	border-radius: 16px;
	padding: 30px;
	display: flex;
	align-items: flex-start;
	gap: 20px;
	box-sizing: border-box;
	transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
	z-index: 1;
}

.ct-integration-card-link {
	position: absolute;
	inset: 0;
	z-index: 5;
	cursor: pointer;
}

/* Brand colored background highlight on hover */
.ct-integration-card::before {
	content: '';
	position: absolute;
	inset: -1px;
	border-radius: inherit;
	background: var(--brand-color, #3b82f6);
	opacity: 0;
	z-index: -1;
	transition: opacity 0.4s cubic-bezier(0.16, 1, 0.3, 1);
	border: 1px solid var(--brand-color, #3b82f6);
}

.ct-integration-card.has-brand-glow:hover {
	transform: translateY(-5px);
	box-shadow: 0 15px 30px rgba(0, 0, 0, 0.5), 0 0 20px var(--brand-color);
}

.ct-integration-card.has-brand-glow:hover::before {
	opacity: 0.08;
}

/* Layout Columns */
.ct-integration-icon-col {
	flex-shrink: 0;
}

.ct-integration-icon-circle {
	width: 48px;
	height: 48px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

.ct-integration-card:hover .ct-integration-icon-circle {
	transform: scale(1.1);
}

.ct-integration-img {
	max-width: 22px;
	max-height: 22px;
	object-fit: contain;
}

.ct-integration-icon i {
	font-size: 20px;
	color: var(--brand-color, #ffffff);
}

.ct-integration-svg {
	display: flex;
	align-items: center;
	justify-content: center;
}

.ct-integration-text-col {
	flex-grow: 1;
}

.ct-integration-title {
	font-size: 18px;
	font-weight: 700;
	margin: 0 0 6px 0;
	color: #ffffff;
}

.ct-integration-desc {
	font-family: 'Inter', sans-serif;
	font-size: 14px;
	line-height: 1.55;
	color: #94a3b8;
	margin: 0;
}

/* Responsive adjustments */
@media (max-width: 991px) {
	.ct-integrations-grid-container {
		grid-template-columns: repeat(2, 1fr);
		gap: 24px;
	}
	.ct-integration-card {
		padding: 24px;
	}
}

@media (max-width: 576px) {
	.ct-integrations-grid-container {
		grid-template-columns: 1fr;
		gap: 20px;
	}
	.ct-integration-card {
		flex-direction: column;
		align-items: flex-start;
		gap: 16px;
	}
}

/* ==========================================================================
   16. CT HEADER MENU LIGHT WIDGET
   ========================================================================== */
.ct-hml-wrapper {
	width: 100%;
	font-family: 'Plus Jakarta Sans', 'Inter', sans-serif;
	position: relative;
	z-index: 9999;
	margin: 0;
	padding: 0;
}

.ct-hml-sticky {
	position: sticky;
	top: 0;
	left: 0;
	right: 0;
}

/* Announcement Bar */
.ct-hml-announcement {
	background: linear-gradient(90deg, #f97316 0%, #ef4444 100%);
	text-align: center;
	z-index: 10000;
	transition: all 0.3s ease;
	position: relative;
	margin: 0;
	width: 100%;
}

.ct-hml-announcement-inner {
	width: 100%;
	max-width: 100%;
	margin: 0;
	padding: 8px 40px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	box-sizing: border-box;
}

.ct-hml-announcement-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 13px;
}

.ct-hml-announcement-text {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 1px;
	text-transform: uppercase;
}

/* Header Container */
.ct-hml-header {
	background: rgba(255, 255, 255, 0.95);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	border-bottom: 1px solid rgba(0, 0, 0, 0.05);
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	width: 100%;
	margin: 0;
}

.ct-hml-header.ct-hml-scrolled {
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
	background: rgba(255, 255, 255, 0.98);
}

.ct-hml-header-inner {
	width: 100%;
	max-width: 100%;
	margin: 0;
	padding: 14px 40px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	box-sizing: border-box;
}

/* Logo & Brand styling */
.ct-hml-logo {
	display: flex;
	align-items: center;
	gap: 12px;
	text-decoration: none !important;
}

.ct-hml-logo-icon-wrap {
	width: 42px;
	height: 42px;
	border-radius: 12px;
	background: linear-gradient(135deg, #ff9800 0%, #ff5722 100%);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 4px 15px rgba(255, 87, 34, 0.3);
}

.ct-hml-logo-icon-wrap i,
.ct-hml-logo-icon-wrap svg {
	font-size: 20px;
	color: #ffffff;
}

.ct-hml-logo-img {
	height: 42px;
	width: auto;
	object-fit: contain;
}

/* Give standalone horizontal logos enough room to remain legible. */
.ct-hml-logo-only .ct-hml-logo-img {
	min-width: 150px;
}

.ct-hml-brand-text {
	display: flex;
	flex-direction: column;
	line-height: 1.1;
}

.ct-hml-brand-name-wrap {
	display: flex;
	align-items: center;
	gap: 6px;
}

.ct-hml-brand-name {
	font-size: 20px;
	font-weight: 800;
	color: #d32f2f;
	letter-spacing: -0.5px;
}

.ct-hml-brand-suffix {
	font-size: 10px;
	font-weight: 700;
	background: #ffb74d;
	color: #d84315;
	padding: 2px 6px;
	border-radius: 4px;
	letter-spacing: 0.5px;
}

.ct-hml-brand-tagline {
	font-size: 8px;
	font-weight: 600;
	color: #555555;
	letter-spacing: 1px;
	text-transform: uppercase;
	margin-top: 3px;
}

/* Desktop Navigation Menu styling */
.ct-hml-nav {
	flex-grow: 1;
}

.ct-hml-nav-wrap {
	display: flex;
	width: 100%;
}

.ct-hml-nav-list {
	display: flex;
	align-items: center;
	list-style: none;
	margin: 0;
	padding: 0;
	width: 100%;
	justify-content: inherit;
}

.ct-hml-nav-list > li {
	position: relative;
	padding: 10px 0;
}

.ct-hml-nav-list > li > a {
	font-size: 14px;
	font-weight: 600;
	color: #333333;
	text-decoration: none;
	transition: all 0.3s ease;
	position: relative;
	display: inline-flex;
	align-items: center;
	padding: 8px 16px;
	border-radius: 8px;
}

.ct-hml-nav-list > li > a::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 16px;
	right: 16px;
	height: 3px;
	background: linear-gradient(90deg, #ffb700 0%, #ff1744 100%);
	transition: transform 0.3s ease;
	transform: scaleX(0);
	transform-origin: center;
	border-radius: 2px;
}

.ct-hml-nav-list > li:hover > a {
	color: #ff1744;
}

.ct-hml-nav-list > li:hover > a::after {
	transform: scaleX(1);
}

.ct-hml-nav-list > li.current-menu-item > a,
.ct-hml-nav-list > li.current_page_item > a,
.ct-hml-nav-list > li.current-menu-ancestor > a {
	color: #ff1744;
	background: #fff0f2;
}

.ct-hml-nav-list > li.current-menu-item > a::after,
.ct-hml-nav-list > li.current_page_item > a::after,
.ct-hml-nav-list > li.current-menu-ancestor > a::after {
	transform: scaleX(1);
}

/* Sub-menus (Dropdowns) */
.ct-hml-nav-list li ul {
	position: absolute;
	top: 100%;
	left: 50%;
	transform: translateX(-50%) translateY(15px);
	background: #ffffff;
	box-shadow: 0 15px 35px rgba(0, 0, 0, 0.08);
	border: 1px solid rgba(0, 0, 0, 0.05);
	border-radius: 12px;
	padding: 12px;
	list-style: none;
	min-width: 220px;
	opacity: 0;
	visibility: hidden;
	transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
	z-index: 999;
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.ct-hml-nav-list li:hover > ul {
	opacity: 1;
	visibility: visible;
	transform: translateX(-50%) translateY(0);
}

.ct-hml-nav-list li ul li {
	position: relative;
}

.ct-hml-nav-list li ul li a {
	font-size: 13px;
	font-weight: 500;
	color: #444444;
	text-decoration: none;
	display: block;
	padding: 8px 12px;
	border-radius: 6px;
	transition: all 0.2s ease;
}

.ct-hml-nav-list li ul li a:hover {
	background: rgba(255, 87, 34, 0.05);
	color: #ff5722;
	padding-left: 16px;
}

/* CTA Button styling */
.ct-hml-cta-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: linear-gradient(90deg, #ff9800 0%, #ff5722 100%);
	color: #ffffff;
	font-size: 13px;
	font-weight: 700;
	text-decoration: none;
	letter-spacing: 0.5px;
	border: none;
	box-shadow: 0 4px 15px rgba(255, 87, 34, 0.2);
	transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
	cursor: pointer;
}

.ct-hml-cta-btn:hover {
	transform: translateY(-2px);
	box-shadow: 0 8px 25px rgba(255, 87, 34, 0.35);
}

.ct-hml-cta-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

/* Hamburger toggle for Mobile */
.ct-hml-hamburger {
	display: none;
	flex-direction: column;
	justify-content: space-between;
	width: 24px;
	height: 18px;
	background: none;
	border: none;
	cursor: pointer;
	padding: 0;
	z-index: 10001;
}

.ct-hml-hamburger span {
	width: 100%;
	height: 2px;
	background: #333333;
	border-radius: 2px;
	transition: all 0.3s ease;
}

.ct-hml-hamburger.ct-hml-open span:nth-child(1) {
	transform: translateY(8px) rotate(45deg);
}

.ct-hml-hamburger.ct-hml-open span:nth-child(2) {
	opacity: 0;
}

.ct-hml-hamburger.ct-hml-open span:nth-child(3) {
	transform: translateY(-8px) rotate(-45deg);
}

/* Mobile Menu Panel */
.ct-hml-mobile-menu {
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	background: #ffffff;
	box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
	border-top: 1px solid rgba(0, 0, 0, 0.05);
	padding: 20px;
	z-index: 9998;
	max-height: 80vh;
	overflow-y: auto;
}

.ct-hml-mobile-menu[hidden] {
	display: none !important;
}

.ct-hml-mobile-nav-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.ct-hml-mobile-nav-list li a {
	display: block;
	font-size: 15px;
	font-weight: 600;
	color: #1a1a1a;
	text-decoration: none;
	padding: 8px 12px;
	border-radius: 8px;
	transition: all 0.2s ease;
}

.ct-hml-mobile-nav-list li a:hover {
	background: rgba(255, 87, 34, 0.05);
	color: #ff5722;
}

/* Mobile Sub-menu */
.ct-hml-mobile-nav-list li ul {
	list-style: none;
	padding-left: 20px;
	margin-top: 8px;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.ct-hml-mobile-nav-list li ul li a {
	font-size: 14px;
	font-weight: 500;
	color: #555555;
}

/* Media Queries */
@media (max-width: 991px) {
	.ct-hml-nav {
		display: none;
	}
	.ct-hml-header-inner .ct-hml-cta-btn {
		display: inline-flex;
		width: 48px;
		height: 48px;
		min-width: 48px;
		border-radius: 50%;
		padding: 0 !important;
		align-items: center;
		justify-content: center;
		margin-right: 15px;
		order: 2;
	}
	.ct-hml-header-inner .ct-hml-cta-icon {
		display: none; /* Hide icon inside header bar CTA on mobile */
	}
	.ct-hml-header-inner .ct-hml-cta-text-first {
		display: block; /* Show only the first word 'Bulk' inside the circle */
		font-size: 10px;
		font-weight: 800;
		line-height: 1;
		letter-spacing: 0;
		text-align: center;
		text-transform: uppercase;
	}
	.ct-hml-header-inner .ct-hml-cta-text-second {
		display: none; /* Hide the rest of the words in the header bar */
	}
	.ct-hml-hamburger {
		display: flex;
		order: 3;
	}
	.ct-hml-logo {
		order: 1;
	}
	.ct-hml-mobile-cta-wrap {
		margin-top: 20px;
		padding: 16px 0 0 0;
		border-top: 1px solid rgba(0, 0, 0, 0.05);
		display: flex;
		justify-content: center;
		width: 100%;
	}
	.ct-hml-mobile-cta-wrap .ct-hml-cta-btn {
		width: 100%;
		height: auto;
		justify-content: center;
		padding: 12px 24px !important;
		font-size: 14px;
		margin-right: 0;
		border-radius: 50px;
	}
	.ct-hml-mobile-cta-wrap .ct-hml-cta-icon {
		display: inline-flex; /* Ensure icon is visible inside mobile drawer */
	}
	.ct-hml-mobile-cta-wrap .ct-hml-cta-text-first,
	.ct-hml-mobile-cta-wrap .ct-hml-cta-text-second {
		display: inline; /* Ensure full text shows inside mobile drawer */
	}
}

@media (max-width: 480px) {
	.ct-hml-header-inner {
		padding: 10px 16px;
	}
	.ct-hml-brand-tagline {
		display: none;
	}
	.ct-hml-brand-name {
		font-size: 16px;
	}
	.ct-hml-logo-icon-wrap {
		width: 34px;
		height: 34px;
		border-radius: 8px;
	}
	.ct-hml-logo-icon-wrap i,
	.ct-hml-logo-icon-wrap svg {
		font-size: 16px;
	}
	.ct-hml-header-inner .ct-hml-cta-btn {
		width: 44px;
		height: 44px;
		min-width: 44px;
		margin-right: 10px;
	}
	.ct-hml-header-inner .ct-hml-cta-text-first {
		font-size: 9px;
	}
}

/* ==========================================================================
   17. CODENTRICKS RELATED POSTS SECTION
   ========================================================================== */
.codentricks-related-posts-section {
	margin: 60px 0 40px 0;
	padding-top: 50px;
	border-top: 1px solid rgba(255, 255, 255, 0.08);
	width: 100%;
	font-family: 'Plus Jakarta Sans', 'Inter', sans-serif;
	box-sizing: border-box;
}

.codentricks-related-posts-heading {
	font-size: 26px;
	font-weight: 800;
	color: #ffffff;
	margin: 0 0 32px 0;
	letter-spacing: -0.5px;
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 12px;
}

.codentricks-related-posts-heading .heading-glow {
	width: 8px;
	height: 24px;
	border-radius: 4px;
	background: linear-gradient(135deg, #6325c5 0%, #9d4edd 100%);
	box-shadow: 0 0 12px rgba(99, 37, 197, 0.5);
}

.codentricks-related-posts-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap: 24px;
	width: 100%;
}

.codentricks-related-posts-grid.cols-1 { grid-template-columns: 1fr; }
.codentricks-related-posts-grid.cols-2 { grid-template-columns: repeat(2, 1fr); }
.codentricks-related-posts-grid.cols-3 { grid-template-columns: repeat(3, 1fr); }
.codentricks-related-posts-grid.cols-4 { grid-template-columns: repeat(4, 1fr); }

@media (max-width: 991px) {
	.codentricks-related-posts-grid.cols-3,
	.codentricks-related-posts-grid.cols-4 {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 600px) {
	.codentricks-related-posts-grid.cols-2,
	.codentricks-related-posts-grid.cols-3,
	.codentricks-related-posts-grid.cols-4 {
		grid-template-columns: 1fr !important;
	}
}

.codentricks-related-post-card {
	position: relative;
	background: rgba(255, 255, 255, 0.02);
	border: 1px solid rgba(255, 255, 255, 0.06);
	border-radius: 16px;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
	backdrop-filter: blur(2px);
}

.codentricks-card-inner-link {
	text-decoration: none !important;
	color: inherit;
	display: flex;
	flex-direction: column;
	height: 100%;
}

.codentricks-related-post-card:hover {
	transform: translateY(-8px);
	border-color: rgba(99, 37, 197, 0.35);
	box-shadow: 0 20px 40px rgba(99, 37, 197, 0.12), 0 0 0 1px rgba(99, 37, 197, 0.15);
	background: rgba(255, 255, 255, 0.04);
}

.codentricks-post-thumb-container {
	position: relative;
	width: 100%;
	aspect-ratio: 16 / 10;
	overflow: hidden;
	background: rgba(0, 0, 0, 0.2);
}

.codentricks-post-thumbnail {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

.codentricks-related-post-card:hover .codentricks-post-thumbnail {
	transform: scale(1.08);
}

.codentricks-post-thumbnail-placeholder {
	width: 100%;
	height: 100%;
	background: linear-gradient(135deg, #1e1b4b 0%, #311042 100%);
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
}

.placeholder-pattern {
	position: absolute;
	inset: 0;
	background-image: radial-gradient(rgba(255, 255, 255, 0.1) 1px, transparent 1px);
	background-size: 16px 16px;
	opacity: 0.3;
}

.placeholder-icon {
	font-size: 48px;
	z-index: 2;
	filter: drop-shadow(0 0 8px rgba(99, 37, 197, 0.5));
}

.codentricks-post-cat-badge {
	position: absolute;
	top: 14px;
	left: 14px;
	background: rgba(255, 255, 255, 0.08);
	backdrop-filter: blur(8px) saturate(180%);
	-webkit-backdrop-filter: blur(8px) saturate(180%);
	border: 1px solid rgba(255, 255, 255, 0.15);
	color: #ffffff;
	font-size: 9px;
	font-weight: 700;
	text-transform: uppercase;
	padding: 5px 10px;
	border-radius: 30px;
	letter-spacing: 0.8px;
	z-index: 5;
	box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
}

.codentricks-post-card-body {
	padding: 12px 18px 15px 18px;
	display: flex;
	flex-direction: column;
	flex-grow: 1;
}

.codentricks-post-meta {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 8px;
}

.meta-item {
	font-size: 11.5px;
	color: #94a3b8;
	font-weight: 500;
	letter-spacing: 0.3px;
}

.codentricks-post-card-title {
	font-size: 16px;
	font-weight: 700;
	line-height: 1.4;
	color: #ffffff;
	margin: 0 0 8px 0;
	transition: color 0.3s ease;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.codentricks-related-post-card:hover .codentricks-post-card-title {
	color: #6325c5;
}

.codentricks-post-card-excerpt {
	font-size: 13px;
	line-height: 1.5;
	color: #94a3b8;
	margin: 0 0 12px 0;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.codentricks-post-card-footer {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-top: auto;
}

.read-more-text {
	font-size: 12.5px;
	font-weight: 700;
	color: #ffffff;
	transition: color 0.3s ease;
}

.codentricks-related-post-card:hover .read-more-text {
	color: #6325c5;
}

.read-more-arrow {
	display: inline-flex;
	align-items: center;
	color: #ffffff;
	transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.read-more-arrow svg {
	width: 16px;
	height: 16px;
}

.codentricks-related-post-card:hover .read-more-arrow {
	color: #6325c5;
	transform: translateX(6px);
}

/* Light theme overrides for default theme styling compatibility */
.light-theme .codentricks-related-posts-section,
[data-theme="light"] .codentricks-related-posts-section {
	border-top-color: rgba(0, 0, 0, 0.08);
}
.light-theme .codentricks-related-posts-heading,
[data-theme="light"] .codentricks-related-posts-heading {
	color: #1e293b;
}
.light-theme .codentricks-related-post-card,
[data-theme="light"] .codentricks-related-post-card {
	background: #ffffff;
	border-color: rgba(0, 0, 0, 0.06);
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
}
.light-theme .codentricks-related-post-card:hover,
[data-theme="light"] .codentricks-related-post-card:hover {
	background: #ffffff;
	border-color: rgba(99, 37, 197, 0.4);
	box-shadow: 0 20px 40px rgba(99, 37, 197, 0.08);
}
.light-theme .codentricks-post-card-title,
[data-theme="light"] .codentricks-post-card-title {
	color: #1e293b;
}
.light-theme .codentricks-post-card-excerpt,
[data-theme="light"] .codentricks-post-card-excerpt {
	color: #64748b;
}
.light-theme .read-more-text,
[data-theme="light"] .read-more-text,
.light-theme .read-more-arrow,
[data-theme="light"] .read-more-arrow {
	color: #1e293b;
}
.light-theme .codentricks-related-post-card:hover .read-more-text,
[data-theme="light"] .codentricks-related-post-card:hover .read-more-text,
.light-theme .codentricks-related-post-card:hover .read-more-arrow,
[data-theme="light"] .codentricks-related-post-card:hover .read-more-arrow {
	color: #6325c5;
}

/* Mobile Responsiveness styling */
@media (max-width: 767px) {
	.codentricks-related-posts-section {
		margin-top: 40px;
		padding-top: 30px;
	}
	.codentricks-related-posts-heading {
		font-size: 22px;
		margin-bottom: 24px;
	}
	.codentricks-related-posts-grid {
		gap: 20px;
	}
	.codentricks-post-thumb-container {
		height: auto;
	}
	.codentricks-post-card-body {
		padding: 10px 14px 12px 14px;
	}
	.codentricks-post-card-title {
		font-size: 15px;
	}
}

/* ==========================================================================
   8. WHATSAPP FLOATING CHAT WINDOW
   ========================================================================== */
.codentricks-wa-chat-button {
	position: fixed !important;
	bottom: 24px !important;
	right: 24px !important;
	width: 60px !important;
	height: 60px !important;
	border-radius: 50% !important;
	background-color: #00a884 !important;
	color: #ffffff !important;
	border: none !important;
	outline: none !important;
	cursor: pointer !important;
	box-shadow: 0 8px 24px rgba(0, 168, 132, 0.3) !important;
	z-index: 99999 !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
	padding: 0 !important;
}

.codentricks-wa-chat-button:hover {
	transform: scale(1.08) !important;
	box-shadow: 0 10px 28px rgba(0, 168, 132, 0.45) !important;
	background-color: #009675 !important;
}

.wa-chat-icon-svg {
	width: 28px !important;
	height: 28px !important;
	fill: currentColor !important;
}

/* Pulse animation around the floating button */
.codentricks-wa-chat-button::after {
	content: '' !important;
	position: absolute !important;
	width: 100% !important;
	height: 100% !important;
	border-radius: 50% !important;
	border: 2px solid #00a884 !important;
	top: 0 !important;
	left: 0 !important;
	animation: codentricks-wa-pulse 2s infinite !important;
	box-sizing: border-box !important;
	pointer-events: none !important;
}

@keyframes codentricks-wa-pulse {
	0% {
		transform: scale(1);
		opacity: 0.8;
	}
	100% {
		transform: scale(1.5);
		opacity: 0;
	}
}

.codentricks-wa-chat-window {
	position: fixed !important;
	bottom: 100px !important;
	right: 24px !important;
	width: 360px !important;
	max-width: calc(100vw - 48px) !important;
	border-radius: 20px !important;
	background: #ffffff !important;
	box-shadow: 0 12px 40px rgba(0, 0, 0, 0.12) !important;
	overflow: hidden !important;
	z-index: 99999 !important;
	display: flex !important;
	flex-direction: column !important;
	box-sizing: border-box !important;
	font-family: 'Plus Jakarta Sans', 'Inter', sans-serif !important;
	opacity: 0 !important;
	transform: translateY(20px) scale(0.95) !important;
	visibility: hidden !important;
	pointer-events: none !important;
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.codentricks-wa-chat-window.open {
	opacity: 1 !important;
	transform: translateY(0) scale(1) !important;
	visibility: visible !important;
	pointer-events: auto !important;
}

.codentricks-wa-chat-header {
	background: #00a884 !important;
	padding: 20px 24px !important;
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	color: #ffffff !important;
	box-sizing: border-box !important;
}

.codentricks-wa-chat-profile {
	display: flex !important;
	align-items: center !important;
	gap: 14px !important;
}

.codentricks-wa-chat-avatar {
	width: 44px !important;
	height: 44px !important;
	border-radius: 50% !important;
	background: rgba(255, 255, 255, 0.15) !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	position: relative !important;
	color: #ffffff !important;
}

.wa-avatar-svg {
	width: 20px !important;
	height: 20px !important;
}

.codentricks-wa-avatar-online {
	position: absolute !important;
	bottom: 0 !important;
	right: 0 !important;
	width: 10px !important;
	height: 10px !important;
	border-radius: 50% !important;
	background-color: #4ade80 !important;
	border: 2px solid #00a884 !important;
}

.codentricks-wa-chat-profile-info {
	display: flex !important;
	flex-direction: column !important;
	gap: 2px !important;
	text-align: left !important;
}

.codentricks-wa-chat-title {
	font-family: 'Plus Jakarta Sans', sans-serif !important;
	font-size: 15px !important;
	font-weight: 700 !important;
	line-height: 1.2 !important;
}

.codentricks-wa-chat-subtitle {
	font-family: 'Inter', sans-serif !important;
	font-size: 11.5px !important;
	color: rgba(255, 255, 255, 0.85) !important;
	line-height: 1.2 !important;
}

.codentricks-wa-chat-close {
	background: none !important;
	border: none !important;
	color: #ffffff !important;
	font-size: 26px !important;
	line-height: 1 !important;
	cursor: pointer !important;
	opacity: 0.85 !important;
	padding: 4px !important;
	transition: opacity 0.2s ease !important;
	outline: none !important;
}

.codentricks-wa-chat-close:hover {
	opacity: 1 !important;
}

.codentricks-wa-chat-body {
	padding: 20px 24px 24px 24px !important;
	background-color: #f4f7f6 !important;
	box-sizing: border-box !important;
}

.codentricks-wa-chat-welcome {
	background: #e6f7f4 !important;
	border: 1px solid #b3e7dd !important;
	border-radius: 12px !important;
	padding: 12px 16px !important;
	display: flex !important;
	gap: 12px !important;
	align-items: flex-start !important;
	margin-bottom: 20px !important;
	box-sizing: border-box !important;
}

.codentricks-wa-chat-welcome-icon {
	width: 20px !important;
	height: 20px !important;
	border-radius: 50% !important;
	background: #00a884 !important;
	color: #ffffff !important;
	font-size: 12px !important;
	font-weight: 700 !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	flex-shrink: 0 !important;
	font-family: sans-serif !important;
}

.welcome-icon-span {
	line-height: 1 !important;
}

.codentricks-wa-chat-welcome-text {
	font-family: 'Inter', sans-serif !important;
	font-size: 13px !important;
	line-height: 1.45 !important;
	color: #1e293b !important;
	text-align: left !important;
}

.codentricks-wa-chat-form {
	display: flex !important;
	flex-direction: column !important;
	gap: 16px !important;
}

.codentricks-wa-chat-form-group {
	display: flex !important;
	flex-direction: column !important;
	gap: 6px !important;
	width: 100% !important;
}

.codentricks-wa-chat-form-label {
	font-family: 'Inter', sans-serif !important;
	font-size: 10px !important;
	font-weight: 800 !important;
	color: #8ca09c !important;
	letter-spacing: 0.5px !important;
	text-transform: uppercase !important;
	text-align: left !important;
}

.codentricks-wa-chat-form-control {
	background: #ffffff !important;
	border: 1px solid #e2e8f0 !important;
	border-radius: 10px !important;
	padding: 10px 14px !important;
	font-family: 'Inter', sans-serif !important;
	font-size: 13px !important;
	color: #1e293b !important;
	box-sizing: border-box !important;
	width: 100% !important;
	transition: all 0.2s ease !important;
}

textarea.codentricks-wa-chat-form-control {
	resize: none !important;
}

.codentricks-wa-chat-form-control:focus {
	outline: none !important;
	border-color: #00a884 !important;
	box-shadow: 0 0 0 3px rgba(0, 168, 132, 0.1) !important;
}

.codentricks-wa-chat-send-btn {
	width: 100% !important;
	border: none !important;
	border-radius: 10px !important;
	padding: 12px 20px !important;
	font-family: 'Plus Jakarta Sans', sans-serif !important;
	font-size: 13px !important;
	font-weight: 800 !important;
	letter-spacing: 0.5px !important;
	color: #ffffff !important;
	background-color: #00a884 !important;
	cursor: pointer !important;
	box-shadow: 0 4px 12px rgba(0, 168, 132, 0.15) !important;
	transition: all 0.25s ease !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 6px !important;
}

.codentricks-wa-chat-send-btn:hover {
	background-color: #009675 !important;
	box-shadow: 0 6px 16px rgba(0, 168, 132, 0.25) !important;
	transform: translateY(-1px) !important;
}

.codentricks-wa-chat-send-btn:active {
	transform: translateY(0) !important;
}

@media (max-width: 480px) {
	.codentricks-wa-chat-button {
		bottom: 16px !important;
		right: 16px !important;
	}
	.codentricks-wa-chat-window {
		bottom: 88px !important;
		right: 16px !important;
		max-width: calc(100vw - 32px) !important;
	}
}

/* Color attributes use round color selectors instead of gallery images. */
.single-product .cf-colour-swatches.is-color-attribute {
	align-items: center;
	gap: 14px !important;
}

.single-product .cf-colour-swatches.is-color-attribute .cf-colour-swatch {
	width: 52px !important;
	height: 52px !important;
	padding: 4px !important;
	border: 1px solid rgba(37, 43, 56, .16) !important;
	border-radius: 50% !important;
	background: #fff !important;
	box-shadow: 0 4px 12px rgba(37, 43, 56, .1) !important;
}

.single-product .cf-colour-swatches.is-color-attribute .cf-colour-swatch::before {
	position: absolute;
	inset: 4px;
	z-index: 0;
	border-radius: 50%;
	content: '';
	background: var(--cf-swatch-color, #d7d7d7);
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .25);
}

.single-product .cf-colour-swatches.is-color-attribute .cf-colour-swatch img {
	display: none !important;
}

.single-product .cf-colour-swatches.is-color-attribute .cf-colour-swatch:hover,
.single-product .cf-colour-swatches.is-color-attribute .cf-colour-swatch:focus-visible {
	border-color: #ff3f71 !important;
	box-shadow: 0 0 0 4px rgba(255, 63, 113, .14), 0 9px 18px rgba(255, 63, 113, .2) !important;
	transform: translateY(-4px) scale(1.04) !important;
}

.single-product .cf-colour-swatches.is-color-attribute .cf-colour-swatch.is-selected {
	border: 2px solid #ff3f71 !important;
	box-shadow: 0 0 0 4px rgba(255, 63, 113, .14), 0 8px 18px rgba(255, 63, 113, .2) !important;
	transform: translateY(-2px) !important;
}

.single-product .cf-colour-swatches.is-color-attribute .cf-colour-swatch::after {
	right: -2px;
	bottom: -2px;
	z-index: 1;
	width: 18px;
	height: 18px;
	border-width: 2px;
}

@media (max-width: 520px) {
	.single-product .cf-colour-swatches.is-color-attribute {
		gap: 11px !important;
	}

	.single-product .cf-colour-swatches.is-color-attribute .cf-colour-swatch {
		width: 45px !important;
		height: 45px !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	.single-product .cf-colour-swatches.is-color-attribute .cf-colour-swatch,
	.single-product .cf-colour-swatches.is-color-attribute .cf-colour-swatch::after {
		transition: none !important;
	}
}

/* Remove static delivery and tax notices from the product summary. */
.single-product .cf-single-delivery-note,
.single-product .cf-tax-note {
	display: none !important;
}

/* Dynamic size and product attribute values. */
.single-product .cf-size-choices,
.single-product .cf-dynamic-attribute-values {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 9px;
	margin: 0 0 1rem;
}

.single-product .cf-size-choice.is-selected {
	background: linear-gradient(135deg, #ff3f71, #ff6d96) !important;
	box-shadow: 0 8px 18px rgba(255, 63, 113, .2) !important;
	color: #fff !important;
}

.single-product .cf-size-choice.is-selected::after {
	opacity: 1;
}

.single-product .cf-dynamic-attributes {
	display: grid;
	gap: 1rem;
	margin-top: .25rem;
}

.single-product .cf-dynamic-attribute {
	margin: 0;
}

.single-product .cf-dynamic-attribute h3 {
	margin-bottom: .55rem !important;
}

.single-product .cf-dynamic-choice,
.single-product .cf-dynamic-value {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 34px;
	padding: .45rem .8rem;
	border: 1px solid rgba(37, 43, 56, .15);
	border-radius: 999px;
	background: #fff;
	color: #4a5261;
	font-size: .68rem;
	font-weight: 700;
	line-height: 1.2;
}

.single-product .cf-dynamic-choice {
	cursor: pointer;
	transition: background .2s ease, border-color .2s ease, color .2s ease, transform .2s ease;
}

.single-product .cf-dynamic-choice:hover,
.single-product .cf-dynamic-choice:focus-visible,
.single-product .cf-dynamic-choice.is-selected {
	border-color: #ff3f71;
	background: #fff1f5;
	color: #d92f60;
	outline: none;
	transform: translateY(-2px);
}

@media (prefers-reduced-motion: reduce) {
	.single-product .cf-dynamic-choice {
		transition: none;
	}
}

/* Keep the homepage navigation visually consistent with inner pages. */
.site-header,
body.home .site-header {
	background: rgba(255, 250, 246, .94) !important;
	border-bottom-color: rgba(234, 222, 218, .8) !important;
}

body.home .site-title,
body.home .main-navigation > ul > li > a,
body.home .main-navigation > div > ul > li > a,
body.home .cf-demo-menu > li > a,
body.home .header-icon {
	color: #2a2224 !important;
}

body.home .mobile-navigation {
	background: rgba(255, 250, 246, .98) !important;
	border-top-color: rgba(234, 222, 218, .8) !important;
}

/* Keep navigation text readable and consistent across every page. */
.main-navigation > ul > li > a,
.main-navigation > div > ul > li > a,
.cf-demo-menu > li > a {
	font-size: 15px !important;
}

.mobile-navigation a,
.mobile-navigation li > a {
	font-size: 15px !important;
}

/* CodentFlow wishlist page */
.cf-wishlist-page {
	max-width: 1200px;
	margin: 0 auto;
	padding: 3.5rem 0 5rem;
}

.cf-wishlist-intro {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 2rem;
	margin-bottom: 2.5rem;
	padding: clamp(2rem, 5vw, 4rem);
	border: 1px solid #eadeda;
	border-radius: 22px;
	background:
		radial-gradient(circle at 88% 12%, rgba(201, 157, 85, .16), transparent 30%),
		linear-gradient(135deg, #fffaf6 0%, #f7ece8 100%);
	box-shadow: 0 18px 55px rgba(61, 27, 34, .08);
}

.cf-wishlist-eyebrow,
.cf-wishlist-category {
	display: block;
	color: #9d435c;
	font-size: .67rem;
	font-weight: 800;
	letter-spacing: .16em;
	line-height: 1.3;
	text-transform: uppercase;
}

.cf-wishlist-intro h2 {
	max-width: 650px;
	margin: .7rem 0 .8rem;
	color: #272224;
	font: 500 clamp(2rem, 4vw, 3.7rem)/1.02 Georgia, serif;
	letter-spacing: -.035em;
}

.cf-wishlist-intro p {
	max-width: 550px;
	margin: 0;
	color: #756c6e;
	font-size: .95rem;
	line-height: 1.75;
}

.cf-wishlist-count {
	flex: 0 0 auto;
	min-width: 108px;
	padding: 1rem 1.15rem;
	border: 1px solid rgba(157, 67, 92, .2);
	border-radius: 999px;
	background: rgba(255, 255, 255, .68);
	color: #756c6e;
	font-size: .67rem;
	font-weight: 700;
	letter-spacing: .08em;
	text-align: center;
	text-transform: uppercase;
}

.cf-wishlist-count strong {
	display: block;
	margin-bottom: .2rem;
	color: #9d435c;
	font: 500 1.55rem/1 Georgia, serif;
	letter-spacing: 0;
}

.cf-wishlist-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 2.5rem 1.5rem;
}

.cf-wishlist-card {
	min-width: 0;
	background: #fff;
}

.cf-wishlist-card-media {
	position: relative;
	aspect-ratio: 3 / 4;
	overflow: hidden;
	background: #f4efec;
}

.cf-wishlist-card-media > a,
.cf-wishlist-image {
	display: block;
	width: 100%;
	height: 100%;
}

.cf-wishlist-image {
	margin: 0 !important;
	object-fit: cover;
	transition: transform .55s ease;
}

.cf-wishlist-card:hover .cf-wishlist-image {
	transform: scale(1.035);
}

.cf-wishlist-remove {
	position: absolute;
	top: 14px;
	right: 14px;
	z-index: 2;
	display: grid;
	width: 38px;
	height: 38px;
	min-height: 38px;
	place-items: center;
	padding: 0;
	border: 1px solid rgba(157, 67, 92, .14);
	border-radius: 50%;
	background: rgba(255, 255, 255, .94);
	color: #9d435c;
	box-shadow: 0 6px 18px rgba(61, 27, 34, .12);
	transition: background .2s ease, color .2s ease, transform .2s ease;
}

.cf-wishlist-remove:hover,
.cf-wishlist-remove:focus-visible {
	background: #9d435c;
	color: #fff;
	outline: none;
	transform: scale(1.06);
}

.cf-wishlist-remove svg {
	width: 18px;
	height: 18px;
	fill: currentColor;
	stroke: currentColor;
	stroke-width: 1.2;
}

.cf-wishlist-remove.is-loading {
	cursor: wait;
	opacity: .55;
	pointer-events: none;
}

.cf-wishlist-sale {
	position: absolute;
	bottom: 14px;
	left: 14px;
	padding: .45rem .65rem;
	border-radius: 3px;
	background: #9d435c;
	color: #fff;
	font-size: .6rem;
	font-weight: 800;
	letter-spacing: .1em;
	text-transform: uppercase;
}

.cf-wishlist-card-body {
	padding: 1rem 0 0;
}

.cf-wishlist-category {
	margin-bottom: .45rem;
	font-size: .58rem;
	letter-spacing: .11em;
}

.cf-wishlist-category a {
	color: inherit;
}

.cf-wishlist-card h3 {
	margin: 0 0 .45rem;
	font: 700 1rem/1.3 Inter, Arial, sans-serif;
}

.cf-wishlist-card h3 a {
	color: #252b38;
}

.cf-wishlist-card h3 a:hover {
	color: #9d435c;
}

.cf-wishlist-price {
	min-height: 1.35rem;
	color: #9d435c;
	font: 800 .9rem/1.35 Inter, Arial, sans-serif;
}

.cf-wishlist-price del {
	margin-right: .35rem;
	color: #9b9291;
	font-size: .78rem;
	font-weight: 400;
}

.cf-wishlist-price ins {
	color: #9d435c;
	text-decoration: none;
}

.cf-wishlist-card-actions {
	margin-top: .95rem;
}

.cf-wishlist-button {
	display: inline-flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	min-height: 42px;
	padding: .7rem .9rem;
	border: 1px solid transparent;
	border-radius: 3px;
	font-size: .63rem;
	font-weight: 800;
	letter-spacing: .11em;
	line-height: 1;
	text-transform: uppercase;
	transition: background .2s ease, color .2s ease, transform .2s ease;
}

.cf-wishlist-button--dark {
	background: #252b38;
	color: #fff !important;
}

.cf-wishlist-button--dark:hover,
.cf-wishlist-button--dark:focus-visible {
	background: #9d435c;
	color: #fff !important;
	transform: translateY(-2px);
}

.cf-wishlist-button span {
	font-size: 1rem;
	font-weight: 400;
	line-height: .5;
}

.cf-wishlist-empty {
	padding: clamp(3rem, 8vw, 6rem) 1.5rem;
	border: 1px solid #eadeda;
	border-radius: 22px;
	background: linear-gradient(145deg, #fff, #fffaf6);
	box-shadow: 0 18px 55px rgba(61, 27, 34, .07);
	text-align: center;
}

.cf-wishlist-empty-icon {
	display: grid;
	width: 76px;
	height: 76px;
	margin: 0 auto 1.5rem;
	place-items: center;
	border: 1px solid rgba(157, 67, 92, .2);
	border-radius: 50%;
	background: #f8e9e8;
	color: #9d435c;
}

.cf-wishlist-empty-icon svg {
	width: 30px;
	height: 30px;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.4;
}

.cf-wishlist-empty h3 {
	margin: .65rem 0 .7rem;
	color: #272224;
	font: 500 clamp(1.8rem, 3vw, 2.6rem)/1.1 Georgia, serif;
}

.cf-wishlist-empty p {
	max-width: 470px;
	margin: 0 auto 1.7rem;
	color: #756c6e;
	font-size: .92rem;
	line-height: 1.7;
}

.cf-wishlist-empty .cf-wishlist-button {
	min-width: 205px;
}

@media (max-width: 900px) {
	.cf-wishlist-page {
		padding: 2.5rem 0 4rem;
	}

	.cf-wishlist-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 560px) {
	.cf-wishlist-intro {
		align-items: flex-start;
		flex-direction: column;
		gap: 1.25rem;
		margin-bottom: 1.75rem;
		padding: 1.8rem 1.25rem;
	}

	.cf-wishlist-intro h2 {
		font-size: 2.2rem;
	}

	.cf-wishlist-intro p {
		font-size: .86rem;
	}

	.cf-wishlist-count {
		align-self: flex-start;
	}

	.cf-wishlist-grid {
		gap: 2rem .8rem;
	}

	.cf-wishlist-card h3 {
		font-size: .86rem;
	}

	.cf-wishlist-card-body {
		padding-top: .75rem;
	}

	.cf-wishlist-button {
		width: 100%;
		padding-inline: .7rem;
		font-size: .56rem;
	}

	.cf-wishlist-remove {
		top: 9px;
		right: 9px;
		width: 33px;
		height: 33px;
		min-height: 33px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.cf-wishlist-image,
	.cf-wishlist-remove,
	.cf-wishlist-button {
		transition: none;
	}
}

/* Full-width wishlist composition and centered visual page banner. */
.page:has(.cf-wishlist-page) .page-header {
	position: relative;
	min-height: 300px;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	padding: 4.5rem 0;
	background:
		linear-gradient(90deg, rgba(38, 24, 29, .78), rgba(38, 24, 29, .32)),
		url('https://images.unsplash.com/photo-1617627143750-d86bc21e42bb?q=85&w=1800&auto=format&fit=crop') center / cover;
	color: #fff;
	text-align: center;
}

.page:has(.cf-wishlist-page) .page-header::after {
	content: "";
	position: absolute;
	inset: 0;
	border-bottom: 1px solid rgba(255, 255, 255, .16);
	background: radial-gradient(circle at 82% 18%, rgba(201, 157, 85, .3), transparent 30%);
	pointer-events: none;
}

.page:has(.cf-wishlist-page) .page-header .container {
	position: relative;
	z-index: 1;
}

.page:has(.cf-wishlist-page) .page-header .eyebrow {
	display: none;
}

.page:has(.cf-wishlist-page) .page-header h1 {
	margin: 0;
	color: #fff;
	font-size: clamp(3rem, 7vw, 5.5rem);
	line-height: 1;
	text-shadow: 0 3px 24px rgba(0, 0, 0, .2);
}

.page:has(.cf-wishlist-page) .content-area.container {
	width: min(1380px, calc(100% - 96px));
	max-width: none;
	padding: 3.5rem 0 5rem;
}

.page:has(.cf-wishlist-page) .entry {
	width: 100%;
	max-width: none;
	margin-inline: auto;
}

.page:has(.cf-wishlist-page) .entry-content > * {
	width: 100%;
	max-width: none;
	margin-inline: auto;
}

.page:has(.cf-wishlist-page) .cf-wishlist-page {
	max-width: none;
	padding: 0;
}

@media (max-width: 760px) {
	.page:has(.cf-wishlist-page) .page-header {
		min-height: 220px;
		padding: 3.5rem 0;
	}

	.page:has(.cf-wishlist-page) .content-area.container {
		width: calc(100% - 32px);
		padding: 2rem 0 4rem;
	}
}

/* Wishlist products follow the current four-column shop-card treatment. */
.page:has(.cf-wishlist-page) .cf-wishlist-grid {
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 2.2rem 1.9rem;
}

.page:has(.cf-wishlist-page) .cf-wishlist-card {
	background: transparent;
}

.page:has(.cf-wishlist-page) .cf-wishlist-card-media {
	aspect-ratio: 3 / 4;
	border-radius: 0;
}

.page:has(.cf-wishlist-page) .cf-wishlist-card-body {
	padding-top: .7rem;
}

.page:has(.cf-wishlist-page) .cf-wishlist-category {
	display: none;
}

.page:has(.cf-wishlist-page) .cf-wishlist-card h3 {
	margin: 0 0 .22rem;
	color: #252b38;
	font: 800 .93rem/1.3 Inter, Arial, sans-serif;
	letter-spacing: 0;
}

.page:has(.cf-wishlist-page) .cf-wishlist-card h3 a {
	color: #252b38;
}

.page:has(.cf-wishlist-page) .cf-wishlist-subtitle {
	overflow: hidden;
	margin: 0 0 .45rem;
	color: #697080;
	font-size: .78rem;
	line-height: 1.35;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.page:has(.cf-wishlist-page) .cf-wishlist-price {
	min-height: 0;
	margin: 0;
	color: #252b38;
	font: 800 .86rem/1.3 Inter, Arial, sans-serif;
}

.page:has(.cf-wishlist-page) .cf-wishlist-price del {
	margin-right: .35rem;
	color: #8a8f98;
	font-size: .78rem;
}

.page:has(.cf-wishlist-page) .cf-wishlist-price ins {
	color: #e16d56;
}

.page:has(.cf-wishlist-page) .cf-wishlist-saving {
	margin: .25rem 0 0;
	color: #e16d56;
	font-size: .73rem;
	font-weight: 700;
	line-height: 1.3;
}

.page:has(.cf-wishlist-page) .cf-wishlist-saving .woocommerce-Price-amount {
	font-weight: 700;
}

.page:has(.cf-wishlist-page) .cf-wishlist-sale {
	right: 12px;
	bottom: 12px;
	left: auto;
	padding: .45rem .65rem;
	border-radius: 3px;
	background: #9d435c;
	font-size: .66rem;
}

.page:has(.cf-wishlist-page) .cf-wishlist-remove {
	top: 12px;
	right: 12px;
	width: 34px;
	height: 34px;
	min-height: 34px;
	border: 0;
	background: #fff;
	color: #252b38;
	box-shadow: 0 3px 10px rgba(0, 0, 0, .1);
}

.page:has(.cf-wishlist-page) .cf-wishlist-remove:hover,
.page:has(.cf-wishlist-page) .cf-wishlist-remove:focus-visible {
	background: #9d435c;
	color: #fff;
}

.page:has(.cf-wishlist-page) .cf-wishlist-card-actions {
	margin-top: .75rem;
}

.page:has(.cf-wishlist-page) .cf-wishlist-button {
	width: 100%;
	min-height: 40px;
	justify-content: center;
	border-radius: 3px;
	background: #252b38;
	font-size: .66rem;
	letter-spacing: .12em;
}

.page:has(.cf-wishlist-page) .cf-wishlist-button:hover,
.page:has(.cf-wishlist-page) .cf-wishlist-button:focus-visible {
	background: #9d435c;
	transform: none;
}

@media (max-width: 1000px) {
	.page:has(.cf-wishlist-page) .cf-wishlist-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media (max-width: 760px) {
	.page:has(.cf-wishlist-page) .cf-wishlist-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 1.8rem .8rem;
	}

	.page:has(.cf-wishlist-page) .cf-wishlist-subtitle {
		font-size: .72rem;
	}

	.page:has(.cf-wishlist-page) .cf-wishlist-button {
		font-size: .58rem;
	}
}

/* One universal navigation logo. */
.site-header .custom-logo-link,
.site-header .cf-theme-logo-link {
	max-width: 350px;
	max-height: 60px;
}

.site-header .custom-logo,
.site-header .custom-logo-link img,
.site-header .cf-theme-logo-link img {
	max-width: 350px !important;
	max-height: 60px !important;
	width: auto;
	height: auto;
	object-fit: contain;
}

@media (max-width: 899px) {
	.site-header .custom-logo-link,
	.site-header .cf-theme-logo-link {
		max-width: 220px;
		max-height: 48px;
	}

	.site-header .custom-logo,
	.site-header .custom-logo-link img,
	.site-header .cf-theme-logo-link img {
		max-width: 220px !important;
		max-height: 48px !important;
	}
}

/* Premium saree journal archive */
body.blog .site-main.content-area.container {
	width: min(1380px, calc(100% - 96px));
	max-width: none;
	padding: 3.5rem 0 5.5rem;
}

body.blog .post-grid {
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 2.5rem 1.6rem;
}

body.blog .cf-blog-hero {
	position: relative;
	grid-column: 1 / -1;
	min-height: 410px;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	margin-bottom: 1.2rem;
	padding: clamp(3rem, 7vw, 6rem) 2rem;
	background:
		linear-gradient(90deg, rgba(29, 17, 21, .76), rgba(29, 17, 21, .28)),
		url('https://images.unsplash.com/photo-1610189012906-4c0aa9b9781e?q=85&w=1800&auto=format&fit=crop') center / cover;
	box-shadow: 0 22px 60px rgba(61, 27, 34, .13);
	text-align: center;
}

body.blog .cf-blog-hero::before {
	content: "";
	position: absolute;
	inset: 18px;
	border: 1px solid rgba(255, 255, 255, .35);
	pointer-events: none;
}

body.blog .cf-blog-hero::after {
	content: "";
	position: absolute;
	inset: 0;
	background: radial-gradient(circle at 78% 18%, rgba(201, 157, 85, .38), transparent 28%);
	pointer-events: none;
}

body.blog .cf-blog-hero-content {
	position: relative;
	z-index: 1;
	max-width: 780px;
}

body.blog .cf-blog-kicker {
	display: block;
	margin-bottom: 1rem;
	color: #e6c27a;
	font-size: .7rem;
	font-weight: 800;
	letter-spacing: .22em;
	text-transform: uppercase;
}

body.blog .cf-blog-hero h1 {
	margin: 0 auto 1.2rem;
	color: #fffaf6;
	font: 500 clamp(2.7rem, 6vw, 5.5rem)/.98 Georgia, serif;
	letter-spacing: -.04em;
	text-shadow: 0 4px 24px rgba(0, 0, 0, .22);
}

body.blog .cf-blog-hero p {
	max-width: 560px;
	margin: 0 auto;
	color: rgba(255, 250, 246, .86);
	font-size: 1rem;
	line-height: 1.75;
}

body.blog .cf-blog-hero-mark {
	display: block;
	margin-top: 1.7rem;
	color: #e6c27a;
	font-size: 1.2rem;
}

body.blog .post-card {
	min-width: 0;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	border: 1px solid rgba(234, 222, 218, .9);
	border-radius: 0;
	background: #fff;
	box-shadow: 0 14px 38px rgba(61, 27, 34, .07);
	transition: transform .28s ease, box-shadow .28s ease;
}

body.blog .post-card:hover {
	transform: translateY(-6px);
	box-shadow: 0 22px 48px rgba(61, 27, 34, .13);
}

body.blog .post-card > a:first-child {
	display: block;
	overflow: hidden;
	background: #f3ebe7;
}

body.blog .post-card > a:first-child img {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	border-radius: 0;
	transition: transform .6s ease;
}

body.blog .post-card:hover > a:first-child img {
	transform: scale(1.045);
}

body.blog .post-card-body {
	flex: 1;
	display: flex;
	flex-direction: column;
	padding: 1.45rem 1.5rem 1.6rem;
}

body.blog .post-card-body .eyebrow {
	color: #9d435c;
	font-size: .63rem;
	letter-spacing: .14em;
}

body.blog .post-card h2 {
	margin: .65rem 0 .7rem;
	font: 500 clamp(1.45rem, 2.2vw, 1.85rem)/1.08 Georgia, serif;
	letter-spacing: -.025em;
}

body.blog .post-card h2 a {
	color: #272224;
}

body.blog .post-card h2 a:hover {
	color: #9d435c;
}

body.blog .post-card p {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	overflow: hidden;
	margin: 0 0 1.2rem;
	color: #756c6e;
	font-size: .88rem;
	line-height: 1.7;
}

body.blog .post-card .text-link {
	align-self: flex-start;
	margin-top: auto;
	padding-top: .5rem;
	border-top: 1px solid #eadeda;
	color: #9d435c;
	font-size: .68rem;
	font-weight: 800;
	letter-spacing: .12em;
	text-transform: uppercase;
}

body.blog .post-card .text-link:hover {
	color: #713044;
}

body.blog .post-card:not(:has(> a:first-child img)) > a:first-child {
	display: none;
}

body.blog .navigation.pagination {
	grid-column: 1 / -1;
	margin-top: 1rem;
}

@media (max-width: 900px) {
	body.blog .site-main.content-area.container {
		width: calc(100% - 48px);
	}

	body.blog .post-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	body.blog .cf-blog-hero {
		min-height: 360px;
	}
}

@media (max-width: 560px) {
	body.blog .site-main.content-area.container {
		width: calc(100% - 32px);
		padding: 2rem 0 4rem;
	}

	body.blog .post-grid {
		grid-template-columns: 1fr;
		gap: 1.5rem;
	}

	body.blog .cf-blog-hero {
		min-height: 360px;
		margin-bottom: .5rem;
		padding: 3rem 1.2rem;
	}

	body.blog .cf-blog-hero::before {
		inset: 12px;
	}

	body.blog .cf-blog-hero h1 {
		font-size: 2.75rem;
	}

	body.blog .cf-blog-hero p {
		font-size: .88rem;
	}
}

@media (prefers-reduced-motion: reduce) {
	body.blog .post-card,
	body.blog .post-card > a:first-child img {
		transition: none;
	}
}

/* Premium single saree article */
body.single-post {
	background: #fffaf6;
}

body.single-post .site-main.content-area.container {
	width: min(1180px, calc(100% - 64px));
	max-width: none;
	padding: 4.5rem 0 6rem;
}

body.single-post .entry {
	width: 100%;
	max-width: none;
	margin: 0 auto;
}

body.single-post .entry-header {
	max-width: 900px;
	margin: 0 auto 2.7rem;
	text-align: center;
}

body.single-post .entry-header .eyebrow {
	color: #9d435c;
	font-size: .68rem;
	letter-spacing: .18em;
}

body.single-post .entry-header h1 {
	margin: .85rem 0 1.15rem;
	color: #272224;
	font: 500 clamp(2.8rem, 6vw, 5.6rem)/.98 Georgia, serif;
	letter-spacing: -.045em;
}

body.single-post .entry-meta {
	color: #8b7c7e;
	font-size: .72rem;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
}

body.single-post .entry > .wp-post-image {
	display: block;
	width: min(920px, 100%);
	height: min(650px, 62vw);
	min-height: 360px;
	margin: 0 auto 3.3rem;
	border-radius: 2px;
	background: #eee3de;
	object-fit: cover;
	object-position: center;
	box-shadow: 0 24px 65px rgba(61, 27, 34, .14);
}

body.single-post .entry-content {
	max-width: none;
	margin: 0;
	color: #4e4446;
	font-size: 1.05rem;
	line-height: 1.95;
}

body.single-post .entry-content > p,
body.single-post .entry-content > h2,
body.single-post .entry-content > h3,
body.single-post .entry-content > ul,
body.single-post .entry-content > ol,
body.single-post .entry-content > blockquote {
	width: min(760px, 100%);
	margin-right: auto;
	margin-left: auto;
}

body.single-post .entry-content > p:first-child {
	color: #3b3032;
	font-size: 1.18rem;
	line-height: 1.85;
}

body.single-post .entry-content > p:first-child::first-letter {
	float: left;
	margin: .12rem .55rem 0 0;
	color: #9d435c;
	font: 500 4.2rem/.78 Georgia, serif;
}

body.single-post .entry-content h2 {
	margin-top: 3rem;
	margin-bottom: .75rem;
	color: #272224;
	font: 500 clamp(1.8rem, 3vw, 2.6rem)/1.1 Georgia, serif;
	letter-spacing: -.03em;
}

body.single-post .entry-content h3 {
	margin-top: 2.4rem;
	margin-bottom: .7rem;
	color: #272224;
	font: 700 1.1rem/1.3 Inter, Arial, sans-serif;
}

body.single-post .entry-content blockquote {
	margin-top: 2.4rem;
	margin-bottom: 2.4rem;
	padding: 1.5rem 1.6rem;
	border-left: 2px solid #c99d55;
	background: #f7ece8;
	color: #713044;
	font: italic 1.25rem/1.7 Georgia, serif;
}

body.single-post .entry-content img:not(.wp-post-image) {
	width: min(860px, 100%);
	margin-top: 2rem;
	margin-bottom: 2rem;
}

body.single-post .cf-article-share {
	width: min(760px, 100%);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1.5rem;
	margin: 3.5rem auto 0;
	padding: 1.15rem 0;
	border-top: 1px solid #eadeda;
	border-bottom: 1px solid #eadeda;
}

.cf-article-share-kicker {
	display: block;
	margin-bottom: .25rem;
	color: #9d435c;
	font-size: .6rem;
	font-weight: 800;
	letter-spacing: .16em;
	line-height: 1.2;
	text-transform: uppercase;
}

.cf-article-share strong {
	color: #272224;
	font: 500 1.15rem/1.2 Georgia, serif;
}

.cf-article-share-actions {
	display: flex;
	align-items: center;
	gap: .45rem;
}

.cf-article-share-actions a,
.cf-article-share-actions button {
	display: grid;
	width: 35px;
	height: 35px;
	min-height: 35px;
	place-items: center;
	padding: 0;
	border: 1px solid #eadeda;
	border-radius: 50%;
	background: #fff;
	color: #5c4f51;
	font: 700 .76rem/1 Inter, Arial, sans-serif;
	text-decoration: none;
	transition: background .2s ease, border-color .2s ease, color .2s ease, transform .2s ease;
}

.cf-article-share-actions a:hover,
.cf-article-share-actions button:hover,
.cf-article-share-actions button.is-copied {
	border-color: #9d435c;
	background: #9d435c;
	color: #fff;
	transform: translateY(-2px);
}

.cf-single-related {
	width: 100%;
	margin: 5rem auto 0;
	padding-top: 3.2rem;
	border-top: 1px solid #eadeda;
}

.cf-single-related-heading {
	margin-bottom: 1.8rem;
	text-align: center;
}

.cf-single-related-heading h2 {
	margin: .45rem 0 0;
	color: #272224;
	font: 500 clamp(2rem, 4vw, 3.2rem)/1.05 Georgia, serif;
	letter-spacing: -.035em;
}

.cf-single-related-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1.5rem;
}

.cf-single-related-card {
	min-width: 0;
	overflow: hidden;
	border: 1px solid #eadeda;
	background: #fff;
	box-shadow: 0 12px 32px rgba(61, 27, 34, .06);
	transition: transform .28s ease, box-shadow .28s ease;
}

.cf-single-related-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 20px 40px rgba(61, 27, 34, .12);
}

.cf-single-related-media {
	display: block;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	background: #f3e9e5;
}

.cf-single-related-media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .55s ease;
}

.cf-single-related-card:hover .cf-single-related-media img {
	transform: scale(1.045);
}

.cf-single-related-body {
	padding: 1rem 1.1rem 1.2rem;
}

.cf-single-related-body > span {
	color: #9d435c;
	font-size: .6rem;
	font-weight: 800;
	letter-spacing: .12em;
	text-transform: uppercase;
}

.cf-single-related-body h3 {
	margin: .45rem 0 .9rem;
	font: 500 1.25rem/1.15 Georgia, serif;
}

.cf-single-related-body h3 a {
	color: #272224;
}

.cf-single-related-body h3 a:hover {
	color: #9d435c;
}

.cf-single-related-link {
	display: inline-flex;
	align-items: center;
	gap: .65rem;
	color: #9d435c;
	font-size: .65rem;
	font-weight: 800;
	letter-spacing: .12em;
	text-transform: uppercase;
}

.cf-single-related-link b {
	font-size: 1rem;
	font-weight: 400;
}

/* Comments are intentionally disabled for the journal experience. */
body.single-post #comments,
body.single-post #respond,
body.single-post .comment-respond,
body.single-post .comments-area,
body.single-post .codentricks-related-posts-section {
	display: none !important;
}

@media (max-width: 760px) {
	body.single-post .site-main.content-area.container {
		width: calc(100% - 32px);
		padding: 3rem 0 4rem;
	}

	body.single-post .entry-header h1 {
		font-size: 3rem;
	}

	body.single-post .entry > .wp-post-image {
		height: 72vw;
		min-height: 280px;
		margin-bottom: 2.3rem;
	}

	body.single-post .entry-content {
		font-size: .98rem;
	}

	body.single-post .cf-article-share {
		align-items: flex-start;
		flex-direction: column;
		gap: 1rem;
		margin-top: 2.5rem;
	}

	.cf-single-related {
		margin-top: 3.5rem;
		padding-top: 2.4rem;
	}

	.cf-single-related-grid {
		grid-template-columns: 1fr;
	}
}

@media (prefers-reduced-motion: reduce) {
	.cf-article-share-actions a,
	.cf-article-share-actions button,
	.cf-single-related-card,
	.cf-single-related-media img {
		transition: none;
	}
}