.kkp-popup {

	--kkp-width: 560px;

	--kkp-bg: #ffffff;

	--kkp-accent: #f58220;

	--kkp-radius: 14px;

	--kkp-overlay-color: #121212;

	--kkp-overlay: 0.54;

	--kkp-border-width: 0px;

	--kkp-border-color: transparent;

	--kkp-border-style: solid;

	--kkp-close-size: 34px;

	--kkp-close-font-size: 23px;

	--kkp-close-offset-x: 0px;

	--kkp-close-offset-y: 0px;

	--kkp-duration: 190ms;

	position: fixed;

	inset: 0;

	z-index: 999999;

	display: none;

	font-family: inherit;

	color: #181818;

}



.kkp-popup.kkp-open {

	display: block;

}



.kkp-has-open {

	overflow: hidden;

}



.kkp-overlay {

	position: absolute;

	inset: 0;

	z-index: 1;

	background: var(--kkp-overlay-color);

	opacity: var(--kkp-overlay);

}



.kkp-frame {

	position: absolute;

	z-index: 2;

	width: min(var(--kkp-width), calc(100vw - 32px));

	max-height: calc(100vh - 40px);

}



.kkp-box {

	position: relative;

	width: 100%;

	max-height: inherit;

	overflow: visible;

	background: var(--kkp-bg);

	border: var(--kkp-border-width) var(--kkp-border-style) var(--kkp-border-color);

	border-radius: var(--kkp-radius);

	box-shadow: 0 24px 70px rgba(0, 0, 0, 0.28);

	outline: none;

}



.kkp-position-center .kkp-frame {

	top: 50%;

	left: 50%;

	transform: translate(-50%, -50%);

}



.kkp-position-bottom_right .kkp-frame {

	right: 24px;

	bottom: 24px;

}



.kkp-position-bottom_left .kkp-frame {

	left: 24px;

	bottom: 24px;

}



.kkp-position-top_bar .kkp-frame,

.kkp-position-bottom_bar .kkp-frame,

.kkp-type-bar .kkp-frame {

	left: 50%;

	width: min(var(--kkp-width), calc(100vw - 24px));

	transform: translateX(-50%);

}



.kkp-position-top_bar .kkp-frame {

	top: 14px;

}



.kkp-position-bottom_bar .kkp-frame,

.kkp-type-bar .kkp-frame {

	bottom: 14px;

}



.kkp-type-slidein .kkp-overlay,

.kkp-type-bar .kkp-overlay {

	background: transparent;

	pointer-events: none;

}



.kkp-close {

	position: absolute;

	top: var(--kkp-close-offset-y);

	right: var(--kkp-close-offset-x);

	z-index: 10;

	display: inline-flex;

	align-items: center;

	justify-content: center;

	width: var(--kkp-close-size);

	height: var(--kkp-close-size);

	padding: 0;

	border: 0;

	border-radius: 0;

	background: transparent;

	color: #343434;

	font-size: var(--kkp-close-font-size);

	line-height: 1;

	cursor: pointer;

}



.kkp-close-position-top_left_inside .kkp-close {

	right: auto;

	left: var(--kkp-close-offset-x);

}



.kkp-close-position-top_right_outside .kkp-close {

	transform: translate(50%, -50%);

}



.kkp-close-position-top_left_outside .kkp-close {

	right: auto;

	left: var(--kkp-close-offset-x);

	transform: translate(-50%, -50%);

}



.kkp-close:hover,

.kkp-close:focus {

	background: transparent;

	color: #000;

}



.kkp-has-elementor .kkp-box > .elementor {

	width: 100%;

}



.kkp-has-elementor .kkp-box > .elementor > .e-con:first-child,

.kkp-has-elementor .kkp-box > .elementor > .elementor-element.e-con:first-child,

.kkp-has-elementor .kkp-box > .elementor > .elementor-section:first-child {

	width: 100%;

	max-width: 100%;

}



.kkp-elementor-stack .kkp-box > .elementor > .e-con:first-child,

.kkp-elementor-stack .kkp-box > .elementor > .elementor-element.e-con:first-child,

.kkp-elementor-stack .kkp-box > .elementor > .elementor-section:first-child {

	display: flex !important;

	flex-direction: column !important;

	align-items: stretch !important;

}



.kkp-elementor-stack .kkp-box > .elementor > .e-con:first-child > .e-con-inner,

.kkp-elementor-stack .kkp-box > .elementor > .elementor-element.e-con:first-child > .e-con-inner,

.kkp-elementor-stack .kkp-box > .elementor > .elementor-section:first-child > .elementor-container {

	display: flex !important;

	flex-direction: column !important;

	align-items: stretch !important;

	width: 100% !important;

	max-width: 100% !important;

}



.kkp-elementor-stack .kkp-box > .elementor > .e-con:first-child > .elementor-element,

.kkp-elementor-stack .kkp-box > .elementor > .elementor-element.e-con:first-child > .elementor-element,

.kkp-elementor-stack .kkp-box > .elementor > .e-con:first-child > .e-con-inner > .elementor-element,

.kkp-elementor-stack .kkp-box > .elementor > .elementor-element.e-con:first-child > .e-con-inner > .elementor-element,

.kkp-elementor-stack .kkp-box > .elementor > .elementor-section:first-child > .elementor-container > .elementor-column {

	width: 100% !important;

	max-width: 100% !important;

}



.kkp-animation-none.kkp-open .kkp-box {

	animation: none;

}



.kkp-animation-fade.kkp-open .kkp-box {

	animation: kkpFade var(--kkp-duration) ease-out both;

}



.kkp-animation-scale.kkp-open .kkp-box,

.kkp-animation-zoom_in.kkp-open .kkp-box {

	animation: kkpZoomIn var(--kkp-duration) cubic-bezier(0.2, 0.8, 0.2, 1) both;

}



.kkp-animation-zoom_out.kkp-open .kkp-box {

	animation: kkpZoomOut var(--kkp-duration) cubic-bezier(0.2, 0.8, 0.2, 1) both;

}



.kkp-animation-slide.kkp-open .kkp-box {

	animation: kkpFromRight var(--kkp-duration) cubic-bezier(0.2, 0.8, 0.2, 1) both;

}



.kkp-animation-slide_left.kkp-open .kkp-box {

	animation: kkpFromLeft var(--kkp-duration) cubic-bezier(0.2, 0.8, 0.2, 1) both;

}



.kkp-animation-slide_down.kkp-open .kkp-box {

	animation: kkpFromTop var(--kkp-duration) cubic-bezier(0.2, 0.8, 0.2, 1) both;

}



.kkp-animation-rise.kkp-open .kkp-box {

	animation: kkpFromBottom var(--kkp-duration) cubic-bezier(0.2, 0.8, 0.2, 1) both;

}



@keyframes kkpFade {

	from {

		opacity: 0;

	}

	to {

		opacity: 1;

	}

}



@keyframes kkpZoomIn {

	from {

		opacity: 0;

		transform: scale(0);

	}

	to {

		opacity: 1;

		transform: scale(1);

	}

}



@keyframes kkpZoomOut {

	from {

		opacity: 0;

		transform: scale(1.45);

	}

	to {

		opacity: 1;

		transform: scale(1);

	}

}



@keyframes kkpFromRight {

	from {

		opacity: 0;

		transform: translateX(calc(100vw + 100% + 96px));

	}

	to {

		opacity: 1;

		transform: translateX(0);

	}

}



@keyframes kkpFromLeft {

	from {

		opacity: 0;

		transform: translateX(calc(-100vw - 100% - 96px));

	}

	to {

		opacity: 1;

		transform: translateX(0);

	}

}



@keyframes kkpFromTop {

	from {

		opacity: 0;

		transform: translateY(calc(-100vh - 100% - 96px));

	}

	to {

		opacity: 1;

		transform: translateY(0);

	}

}



@keyframes kkpFromBottom {

	from {

		opacity: 0;

		transform: translateY(calc(100vh + 100% + 96px));

	}

	to {

		opacity: 1;

		transform: translateY(0);

	}

}



@media (max-width: 767px) {

	.kkp-popup {

		inset: 0;

	}



	.kkp-frame,

	.kkp-position-bottom_right .kkp-frame,

	.kkp-position-bottom_left .kkp-frame {

		left: 12px;

		right: 12px;

		bottom: 12px;

		width: auto;

		max-height: calc(100vh - 24px);

	}



	.kkp-position-center .kkp-frame {

		top: auto;

		left: 12px;

		right: 12px;

		bottom: 12px;

		width: auto;

		transform: none;

	}

}



/* KATI Lead Magnet screen-filler & scroll mat: isolated additional display styles. */

.kkp-position-fullscreen .kkp-overlay, .kkp-position-scroll_mat .kkp-overlay { background: var(--kkp-overlay-color); }

.kkp-position-fullscreen .kkp-frame, .kkp-position-scroll_mat .kkp-frame {

    position:absolute; inset:0; width:100%; max-height:100vh;

    display:flex; align-items:center; justify-content:center; transform:none;

}

.kkp-position-fullscreen .kkp-box, .kkp-position-scroll_mat .kkp-box {

    width:100%; height:100%; overflow:auto; max-height:100vh;

    border-radius:0; display:flex; flex-direction:column; justify-content:center;

}

.kkp-position-scroll_mat .kkp-frame { align-items:flex-start; }

.kkp-position-scroll_mat .kkp-box { height:auto; min-height:70vh; max-height:95vh; }

@media(max-width:767px) {

    .kkp-position-fullscreen .kkp-frame, .kkp-position-scroll_mat .kkp-frame { inset:0; width:100%; max-height:100dvh; }

    .kkp-position-fullscreen .kkp-box, .kkp-position-scroll_mat .kkp-box { max-height:100dvh; }

}





/* ==========================================================================

   Katipop In-Content & Post-Footer Lead Capture Boxes (Kati Style)

   ========================================================================== */

.katipop-in-content-wrap {

	margin: 36px auto;

	clear: both;

	box-sizing: border-box;

	display: block;

	max-width: var(--katipop-max-width, 760px);

	width: 100%;

}



.katipop-in-content-box {

	position: relative;

	margin: 0 auto;

	width: 100%;

	background: var(--katipop-bg, #ffffff);

	border: var(--katipop-border-width, 1px) var(--katipop-border-style, solid) var(--katipop-border-color, #e5e7eb);

	border-radius: var(--katipop-radius, 12px);

	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.07);

	overflow: hidden;

	transition: transform 0.25s ease, box-shadow 0.25s ease;

}



.katipop-in-content-box:hover {

	box-shadow: 0 16px 40px rgba(0, 0, 0, 0.11);

}



.katipop-badge-bar {

	padding: 16px 24px 0;

}



.katipop-badge {

	display: inline-block;

	background: var(--katipop-accent, #f58220);

	color: #ffffff;

	font-size: 11px;

	font-weight: 700;

	text-transform: uppercase;

	letter-spacing: 0.8px;

	padding: 4px 12px;

	border-radius: 4px;

}



.katipop-in-content-inner {

	padding: 24px;

	box-sizing: border-box;

	line-height: 1.6;

}



/* ==========================================================================

   Elementor In-Content Lead Form Display: 100% Elementor Fidelity

   Removes fixed 760px restrictions, allowing Elementor container / section

   width (Boxed or Full-width), margins, paddings, backgrounds to govern layout.

   ========================================================================== */

.katipop-in-content-wrap.katipop-has-elementor {

	max-width: 100% !important;

	width: 100% !important;

	margin: 28px auto !important;

	padding: 0 !important;

	background: transparent !important;

	border: none !important;

	box-shadow: none !important;

}



.katipop-in-content-wrap.katipop-has-elementor .katipop-in-content-inner {

	padding: 0 !important;

	margin: 0 !important;

	width: 100% !important;

	max-width: 100% !important;

	background: transparent !important;

	border: none !important;

}



.katipop-in-content-wrap.katipop-has-elementor .elementor {

	width: 100% !important;

	max-width: 100% !important;

	margin-left: auto;

	margin-right: auto;

}



.katipop-in-content-wrap.katipop-has-elementor .elementor-section.elementor-section-boxed > .elementor-container,

.katipop-in-content-wrap.katipop-has-elementor .e-con--boxed {

	margin-left: auto !important;

	margin-right: auto !important;

}



/* Post footer specific styling */

.katipop-placement-post_footer {

	margin-top: 48px;

	margin-bottom: 32px;

}



/* Top post callout */

.katipop-placement-in_content_top {

	margin-top: 24px;

	margin-bottom: 32px;

}



/* Button action inside box */

.katipop-btn-action {

	display: inline-flex;

	align-items: center;

	justify-content: center;

	padding: 12px 24px;

	background: var(--katipop-accent, #f58220);

	color: #ffffff !important;

	font-weight: 600;

	text-decoration: none !important;

	border-radius: 6px;

	border: none;

	cursor: pointer;

	transition: filter 0.2s ease, transform 0.15s ease;

}



.katipop-btn-action:hover {

	filter: brightness(1.1);

	transform: translateY(-1px);

}





/* ==========================================================================

   KATIPOP RUNTIME OVERLAYS: MODAL (LIGHTBOX), SLIDE-IN, RIBBON (BAR)

   Kati positioning, z-indexes, backdrops, and dimensions.

   ========================================================================== */



/* Prevent hidden template items from ever rendering in page flow */

#katipop-runtime-container,

.katipop-popup-item {

	display: none !important;

}



/* 1. Base Popup Root: Hidden by default, zero footprint in document flow */

.kati-popup-root {

	display: none !important;

	position: fixed !important;

	box-sizing: border-box !important;

}



.kati-popup-root *,

.kati-popup-root *::before,

.kati-popup-root *::after {

	box-sizing: border-box;

}



/* ==========================================================================

   LIGHTBOX / MODAL POPUP (Kati Style)

   ========================================================================== */

.kati-popup-root.kati-popup-modal {

	inset: 0 !important;

	width: 100vw !important;

	height: 100vh !important;

	z-index: 999999 !important;

	align-items: center !important;

	justify-content: center !important;

	padding: 20px !important;

}



.kati-popup-root.kati-popup-modal.is-active {

	display: flex !important;

}



.kati-popup-root.kati-popup-modal .kati-popup-backdrop {

	position: fixed !important;

	inset: 0 !important;

	background: rgba(15, 23, 42, 0.65) !important;

	backdrop-filter: blur(4px) !important;

	-webkit-backdrop-filter: blur(4px) !important;

	display: flex !important;

	align-items: center !important;

	justify-content: center !important;

	padding: 16px !important;

	animation: katipopFadeIn 0.25s ease forwards;

}



.kati-popup-root.kati-popup-modal .kati-popup-dialog {

	position: relative !important;

	width: min(640px, calc(100vw - 32px)) !important;

	max-height: calc(100vh - 40px) !important;

	overflow-y: auto !important;

	background: #ffffff !important;

	border-radius: 14px !important;

	box-shadow: 0 25px 60px -10px rgba(0, 0, 0, 0.35) !important;

	animation: katipopPopIn 0.3s cubic-bezier(0.16, 1, 0.3, 1) forwards;

}



/* ==========================================================================

   SLIDE-IN (CORNER WIDGET - 4 POSITIONS)

   Kati: bot_right, bot_left, top_right, top_left

   ========================================================================== */

.kati-popup-root.kati-popup-slidein {

	width: min(420px, calc(100vw - 32px)) !important;

	max-width: calc(100vw - 32px) !important;

	height: auto !important;

	z-index: 999990 !important;

	pointer-events: none !important;

	margin: 0 !important;

	padding: 0 !important;

}



.kati-popup-root.kati-popup-slidein.is-active {

	display: block !important;

}



.kati-popup-root.kati-popup-slidein .kati-popup-backdrop {

	position: static !important;

	background: transparent !important;

	pointer-events: none !important;

	padding: 0 !important;

}



.kati-popup-root.kati-popup-slidein .kati-popup-dialog {

	position: relative !important;

	pointer-events: auto !important;

	max-height: calc(100vh - 48px) !important;

	overflow-y: auto !important;

	background: #ffffff !important;

	border-radius: 14px !important;

	border: 1px solid #e2e8f0 !important;

	box-shadow: 0 16px 40px -6px rgba(0, 0, 0, 0.22), 0 0 0 1px rgba(0, 0, 0, 0.05) !important;

	animation: katipopSlideUp 0.35s cubic-bezier(0.16, 1, 0.3, 1) forwards;

}



/* 4 Slide-in Positions */

.kati-popup-root.kati-popup-slidein.pos-bot_right,

.kati-popup-root.kati-popup-slidein.pos-bottom_right,

.kati-popup-root.kati-popup-slidein:not(.pos-bot_left):not(.pos-bottom_left):not(.pos-top_right):not(.pos-top_left) {

	top: auto !important;

	left: auto !important;

	right: 24px !important;

	bottom: 24px !important;

}



.kati-popup-root.kati-popup-slidein.pos-bot_left,

.kati-popup-root.kati-popup-slidein.pos-bottom_left {

	top: auto !important;

	right: auto !important;

	left: 24px !important;

	bottom: 24px !important;

}



.kati-popup-root.kati-popup-slidein.pos-top_right {

	bottom: auto !important;

	left: auto !important;

	right: 24px !important;

	top: 24px !important;

}



.kati-popup-root.kati-popup-slidein.pos-top_left {

	bottom: auto !important;

	right: auto !important;

	left: 24px !important;

	top: 24px !important;

}



.admin-bar .kati-popup-root.kati-popup-slidein.pos-top_right,

.admin-bar .kati-popup-root.kati-popup-slidein.pos-top_left {

	top: calc(24px + 32px) !important;

}



@media (max-width: 767px) {

	.kati-popup-root.kati-popup-slidein.pos-bot_right,

	.kati-popup-root.kati-popup-slidein.pos-bottom_right,

	.kati-popup-root.kati-popup-slidein.pos-bot_left,

	.kati-popup-root.kati-popup-slidein.pos-bottom_left,

	.kati-popup-root.kati-popup-slidein:not(.pos-top_right):not(.pos-top_left) {

		left: 12px !important;

		right: 12px !important;

		bottom: 12px !important;

		width: calc(100vw - 24px) !important;

	}

	.kati-popup-root.kati-popup-slidein.pos-top_right,

	.kati-popup-root.kati-popup-slidein.pos-top_left {

		left: 12px !important;

		right: 12px !important;

		top: 12px !important;

		width: calc(100vw - 24px) !important;

	}

	.admin-bar .kati-popup-root.kati-popup-slidein.pos-top_right,

	.admin-bar .kati-popup-root.kati-popup-slidein.pos-top_left {

		top: calc(12px + 46px) !important;

	}

}



/* ==========================================================================

   RIBBON / BAR (TOP OR BOTTOM NOTIFICATION)

   ========================================================================== */

.kati-popup-root.kati-popup-bar {

	left: 0 !important;

	right: 0 !important;

	width: 100vw !important;

	max-width: 100vw !important;

	height: auto !important;

	z-index: 999980 !important;

	pointer-events: none !important;

	margin: 0 !important;

	padding: 0 !important;

}



.kati-popup-root.kati-popup-bar.is-active {

	display: block !important;

}



.kati-popup-root.kati-popup-bar .kati-popup-backdrop {

	position: static !important;

	background: transparent !important;

	pointer-events: none !important;

	padding: 0 !important;

}



.kati-popup-root.kati-popup-bar .kati-popup-dialog {

	pointer-events: auto !important;

	position: relative !important;

	width: 100% !important;

	background: #ffffff !important;

	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15) !important;

}



.kati-popup-root.kati-popup-bar.pos-top,

.kati-popup-root.kati-popup-bar:not(.pos-bottom) {

	top: 0 !important;

	bottom: auto !important;

}



.admin-bar .kati-popup-root.kati-popup-bar.pos-top,

.admin-bar .kati-popup-root.kati-popup-bar:not(.pos-bottom) {

	top: 32px !important;

}



@media (max-width: 782px) {

	.admin-bar .kati-popup-root.kati-popup-bar.pos-top,

	.admin-bar .kati-popup-root.kati-popup-bar:not(.pos-bottom) {

		top: 46px !important;

	}

}



.kati-popup-root.kati-popup-bar.pos-bottom {

	bottom: 0 !important;

	top: auto !important;

}



.kati-popup-root.kati-popup-bar .kati-popup-dialog {

	animation: katipopSlideDown 0.3s ease forwards;

}



.kati-popup-root.kati-popup-bar.pos-bottom .kati-popup-dialog {

	animation: katipopSlideUp 0.3s ease forwards;

}



/* ==========================================================================

   CLOSE BUTTON & CONTENT BODY

   ========================================================================== */

.kati-popup-root .kati-popup-close {

	position: absolute;

	top: 10px;

	right: 10px;

	z-index: 100;

	width: 30px;

	height: 30px;

	padding: 0;

	margin: 0;

	border: none;

	border-radius: 50%;

	background: rgba(241, 245, 249, 0.9);

	color: #475569;

	font-size: 20px;

	font-weight: 700;

	line-height: 1;

	cursor: pointer;

	display: flex;

	align-items: center;

	justify-content: center;

	transition: background 0.2s ease, color 0.2s ease, transform 0.15s ease;

}



.kati-popup-root .kati-popup-close:hover {

	background: #ef4444;

	color: #ffffff;

	transform: scale(1.08);

}



.kati-popup-root .kati-popup-body {

	position: relative;

	width: 100%;

}



/* Animations */

@keyframes katipopFadeIn {

	from { opacity: 0; }

	to   { opacity: 1; }

}



@keyframes katipopPopIn {

	from { opacity: 0; transform: scale(0.92) translateY(12px); }

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

}



@keyframes katipopSlideUp {

	from { opacity: 0; transform: translateY(40px) scale(0.96); }

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

}



@keyframes katipopSlideDown {

	from { opacity: 0; transform: translateY(-100%); }

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

}



@media (max-width: 767px) {

	.kati-popup-root.kati-popup-slidein {

		right: 12px !important;

		bottom: 12px !important;

		width: calc(100vw - 24px) !important;

	}

	.kati-popup-root.kati-popup-modal .kati-popup-dialog {

		width: calc(100vw - 24px);

		max-height: calc(100vh - 24px);

	}

}


/* ==========================================================================
   2-STEP MULTI-STATE POPUP & IN-PLACE FORM TRANSITION
   ========================================================================== */
.katipop-two-step-container {
	position: relative;
	overflow: hidden;
	width: 100%;
}

.katipop-step {
	width: 100%;
	transition: opacity 0.3s cubic-bezier(0.16, 1, 0.3, 1), transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.katipop-step-form-wrap {
	width: 100%;
	margin-top: 12px;
}

.katipop-form-field {
	margin-bottom: 12px;
	width: 100%;
	text-align: left;
}

.katipop-form-field label {
	display: block;
	font-size: 12px;
	font-weight: 700;
	color: #334155;
	margin-bottom: 4px;
	text-transform: uppercase;
	letter-spacing: 0.5px;
}

.katipop-form-field input.katipop-input {
	width: 100% !important;
	padding: 12px 16px !important;
	border: 1.5px solid #cbd5e1 !important;
	border-radius: 8px !important;
	font-size: 14px !important;
	color: #0f172a !important;
	background: #ffffff !important;
	box-sizing: border-box !important;
	outline: none !important;
	transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
	font-family: inherit !important;
}

.katipop-form-field input.katipop-input:focus {
	border-color: #2563eb !important;
	box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.18) !important;
}

.katipop-btn-submit {
	width: 100% !important;
	padding: 13px 20px !important;
	font-size: 15px !important;
	font-weight: 700 !important;
	color: #ffffff !important;
	border: none !important;
	border-radius: 8px !important;
	cursor: pointer !important;
	transition: all 0.2s ease !important;
	display: block !important;
	text-align: center !important;
	box-shadow: 0 4px 14px rgba(0,0,0,0.12) !important;
	font-family: inherit !important;
	text-decoration: none !important;
}

.katipop-btn-submit:hover {
	transform: translateY(-1px) !important;
	box-shadow: 0 6px 20px rgba(0,0,0,0.18) !important;
	opacity: 0.95;
}

.katipop-btn-prev-step {
	display: inline-block !important;
	margin-top: 10px !important;
	font-size: 13px !important;
	font-weight: 600 !important;
	color: #64748b !important;
	text-decoration: none !important;
	cursor: pointer !important;
	transition: all 0.15s ease !important;
}

.katipop-btn-prev-step:hover {
	color: #0f172a !important;
	text-decoration: underline !important;
}

.elementor-widget-button.katipop-btn-prev-step .elementor-button,
.katipop-btn-prev-step .elementor-button {
	background-color: transparent !important;
	color: #64748b !important;
	padding: 6px 12px !important;
	font-size: 13px !important;
	font-weight: 600 !important;
	box-shadow: none !important;
	border: none !important;
}

.elementor-widget-button.katipop-btn-prev-step .elementor-button:hover,
.katipop-btn-prev-step .elementor-button:hover {
	background-color: rgba(0, 0, 0, 0.05) !important;
	color: #0f172a !important;
	text-decoration: underline !important;
}

.katipop-form-container[style*="#0f172a"] .katipop-btn-prev-step .elementor-button,
.katipop-form-container[style*="#0b1329"] .katipop-btn-prev-step .elementor-button {
	color: #94a3b8 !important;
}
.katipop-form-container[style*="#0f172a"] .katipop-btn-prev-step .elementor-button:hover,
.katipop-form-container[style*="#0b1329"] .katipop-btn-prev-step .elementor-button:hover {
	color: #ffffff !important;
	background-color: rgba(255, 255, 255, 0.08) !important;
}

.katipop-step-success {
	display: none;
	background: #ecfdf5;
	border: 1.5px solid #10b981;
	padding: 20px;
	border-radius: 12px;
	color: #064e3b;
	text-align: center;
	margin-top: 12px;
}

.katipop-step-success h4 {
	margin: 0 0 6px;
	font-size: 18px;
	color: #047857;
	font-weight: 800;
}

.katipop-step-success p {
	margin: 0;
	font-size: 13px;
	color: #065f46;
}

/* Frontend: Step 2 hidden by default */
body:not(.elementor-editor-active) .katipop-step-2 {
	display: none;
}

/* Elementor Editor: Show both steps with visual badge for easy editing */
body.elementor-editor-active .katipop-step-2 {
	display: block !important;
	border-top: 2px dashed #94a3b8;
	margin-top: 24px;
	padding-top: 24px;
}

body.elementor-editor-active .katipop-step-2::before {
	content: "⚡ [BƯỚC 2 - TRẠNG THÁI FORM XUẤT HIỆN TẠI VỊ TRÍ NÀY KHI BẤM NÚT BƯỚC 1]";
	display: block;
	font-size: 11px;
	font-weight: 700;
	color: #059669;
	background: #ecfdf5;
	padding: 6px 12px;
	border-radius: 6px;
	margin-bottom: 16px;
	text-transform: uppercase;
	text-align: center;
}