:root {
	--beyou-wa-olive: #6b705c;
	--beyou-wa-olive-deep: #4f5544;
	--beyou-wa-sage: #b8b7a3;
	--beyou-wa-sand: #dfd3bb;
	--beyou-wa-blush: #ddbea9;
	--beyou-wa-clay: #c58c6e;
	--beyou-wa-paper: #fdfbf7;
	--beyou-wa-ink: #30342a;
	--beyou-wa-muted: #696d63;
	--beyou-wa-border: #ded8cd;
	--beyou-wa-green: #25d366;
}

.beyou-wa-fab,
.beyou-wa-inline-button,
.beyou-wa-dialog,
.beyou-wa-dialog * {
	box-sizing: border-box;
}

.beyou-wa-fab,
.beyou-wa-inline-button,
.beyou-wa-dialog {
	font-family: "Rubik", "Assistant", Arial, sans-serif;
}

.beyou-wa-fab {
	position: fixed;
	left: 20px;
	bottom: 22px;
	z-index: 99997;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	min-height: 54px;
	padding: 12px 20px;
	border: 1px solid rgba(255, 255, 255, 0.72);
	border-radius: 999px;
	background: var(--beyou-wa-olive);
	box-shadow: 0 13px 34px rgba(58, 61, 49, 0.28);
	color: #fff;
	font-size: 15px;
	font-weight: 600;
	line-height: 1;
	cursor: pointer;
	transition: transform 180ms ease, background-color 180ms ease, box-shadow 180ms ease;
}

.beyou-wa-fab:hover {
	background: var(--beyou-wa-olive-deep);
	box-shadow: 0 16px 38px rgba(58, 61, 49, 0.34);
	color: #fff;
	transform: translateY(-2px);
}

.beyou-wa-fab:focus-visible,
.beyou-wa-inline-button:focus-visible {
	outline: 3px solid rgba(197, 140, 110, 0.62);
	outline-offset: 3px;
}

.beyou-wa-fab-icon,
.beyou-wa-confirm-icon {
	display: inline-grid;
	place-items: center;
	width: 24px;
	height: 24px;
	flex: 0 0 24px;
}

.beyou-wa-fab-icon svg,
.beyou-wa-confirm-icon svg {
	display: block;
	width: 24px;
	height: 24px;
	fill: none;
	stroke: currentColor;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 1.75;
}

.beyou-wa-inline-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	padding: 11px 24px;
	border: 1px solid var(--beyou-wa-olive);
	border-radius: 999px;
	background: var(--beyou-wa-olive);
	color: #fff;
	font-size: 16px;
	font-weight: 600;
	cursor: pointer;
	transition: background-color 180ms ease, color 180ms ease, transform 180ms ease;
}

.beyou-wa-inline-button:hover {
	background: var(--beyou-wa-olive-deep);
	color: #fff;
	transform: translateY(-1px);
}

.beyou-wa-dialog {
	position: fixed;
	inset: 0;
	z-index: 100000;
	display: grid;
	place-items: center;
	padding: 22px;
	background: rgba(38, 41, 33, 0.64);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	animation: beyou-wa-fade-in 200ms ease both;
}

.beyou-wa-dialog[hidden] {
	display: none;
}

.beyou-wa-panel {
	position: relative;
	direction: rtl;
	width: min(570px, 100%);
	max-height: calc(100dvh - 44px);
	overflow-x: hidden;
	overflow-y: auto;
	padding: 30px 34px 24px;
	border: 1px solid rgba(197, 140, 110, 0.44);
	border-radius: 28px;
	background:
		radial-gradient(circle at 100% 0, rgba(221, 190, 169, 0.55) 0, rgba(221, 190, 169, 0) 31%),
		radial-gradient(circle at 0 100%, rgba(223, 211, 187, 0.5) 0, rgba(223, 211, 187, 0) 27%),
		var(--beyou-wa-paper);
	box-shadow: 0 28px 85px rgba(41, 44, 35, 0.3);
	color: var(--beyou-wa-ink);
	font-size: 16px;
	line-height: 1.55;
	text-align: right;
	scrollbar-color: var(--beyou-wa-sage) transparent;
	animation: beyou-wa-panel-in 240ms ease both;
}

.beyou-wa-panel::before {
	position: absolute;
	top: 0;
	right: 44px;
	left: 44px;
	height: 4px;
	border-radius: 0 0 999px 999px;
	background: linear-gradient(90deg, var(--beyou-wa-blush), var(--beyou-wa-olive), var(--beyou-wa-sand));
	content: "";
}

.beyou-wa-close {
	position: absolute;
	top: 19px;
	left: 20px;
	z-index: 2;
	display: grid;
	place-items: center;
	width: 40px;
	height: 40px;
	padding: 0;
	border: 1px solid rgba(107, 112, 92, 0.3);
	border-radius: 50%;
	background: rgba(253, 251, 247, 0.72);
	color: var(--beyou-wa-olive-deep);
	cursor: pointer;
	transition: background-color 180ms ease, border-color 180ms ease, transform 180ms ease;
}

.beyou-wa-close svg {
	width: 21px;
	height: 21px;
	fill: none;
	stroke: currentColor;
	stroke-linecap: round;
	stroke-width: 1.7;
}

.beyou-wa-close:hover {
	border-color: var(--beyou-wa-clay);
	background: #fff;
	transform: rotate(5deg);
}

.beyou-wa-close:focus-visible,
.beyou-wa-back:focus-visible,
.beyou-wa-options button:focus-visible,
.beyou-wa-confirm:focus-visible,
.beyou-wa-cancel:focus-visible {
	outline: 3px solid rgba(197, 140, 110, 0.52);
	outline-offset: 3px;
}

.beyou-wa-header {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 24px;
	padding-left: 50px;
}

.beyou-wa-kicker {
	margin: 0 0 3px;
	color: var(--beyou-wa-clay);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.beyou-wa-brand-line {
	margin: 0;
	color: var(--beyou-wa-olive-deep);
	font-size: 13px;
	font-weight: 500;
}

.beyou-wa-step-meta {
	display: grid;
	gap: 2px;
	color: var(--beyou-wa-muted);
	font-size: 11px;
	text-align: left;
	white-space: nowrap;
}

.beyou-wa-step-meta strong {
	color: var(--beyou-wa-olive-deep);
	font-size: 12px;
	font-weight: 600;
}

.beyou-wa-progress {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 8px;
	direction: rtl;
	margin: 18px 0 26px;
}

.beyou-wa-progress span {
	height: 4px;
	border-radius: 999px;
	background: #e8e2d8;
	transition: background-color 180ms ease;
}

.beyou-wa-progress span.is-active {
	background: var(--beyou-wa-clay);
}

.beyou-wa-progress span.is-complete {
	background: var(--beyou-wa-olive);
}

.beyou-wa-step[hidden] {
	display: none;
}

.beyou-wa-step {
	animation: beyou-wa-step-in 200ms ease both;
}

.beyou-wa-panel h2 {
	margin: 0 0 9px;
	color: var(--beyou-wa-ink);
	font-family: "Rubik", "Assistant", Arial, sans-serif;
	font-size: clamp(27px, 5vw, 36px);
	font-weight: 500;
	letter-spacing: -0.025em;
	line-height: 1.2;
}

.beyou-wa-panel h2:focus {
	outline: none;
}

.beyou-wa-intro {
	max-width: 465px;
	margin: 0 0 21px;
	color: var(--beyou-wa-muted);
	font-size: 15px;
	line-height: 1.7;
}

.beyou-wa-options {
	display: grid;
	gap: 10px;
}

.beyou-wa-options button {
	position: relative;
	display: flex;
	align-items: center;
	gap: 14px;
	width: 100%;
	min-height: 62px;
	padding: 12px 18px 12px 46px;
	border: 1px solid var(--beyou-wa-border);
	border-radius: 16px;
	background: rgba(255, 255, 255, 0.72);
	box-shadow: 0 5px 16px rgba(58, 61, 49, 0.035);
	color: var(--beyou-wa-ink);
	font-family: "Rubik", "Assistant", Arial, sans-serif;
	font-size: 15px;
	line-height: 1.35;
	text-align: right;
	cursor: pointer;
	transition: border-color 180ms ease, background-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

.beyou-wa-options button::after {
	position: absolute;
	top: 50%;
	left: 17px;
	color: var(--beyou-wa-clay);
	font-size: 20px;
	font-weight: 400;
	transform: translateY(-53%);
	transition: transform 180ms ease;
	content: "←";
}

.beyou-wa-options button:hover {
	border-color: rgba(197, 140, 110, 0.72);
	background: #fff;
	box-shadow: 0 9px 24px rgba(77, 80, 65, 0.09);
	transform: translateX(-2px);
}

.beyou-wa-options button:hover::after {
	transform: translate(-3px, -53%);
}

.beyou-wa-options button > span:not(.beyou-wa-option-icon) {
	display: grid;
	gap: 3px;
}

.beyou-wa-options button strong {
	color: var(--beyou-wa-ink);
	font-size: 15px;
	font-weight: 600;
}

.beyou-wa-options button small {
	display: block;
	color: var(--beyou-wa-muted);
	font-size: 12px;
	font-weight: 400;
	line-height: 1.4;
}

.beyou-wa-option-icon {
	display: grid;
	place-items: center;
	width: 38px;
	height: 38px;
	flex: 0 0 38px;
	border-radius: 50%;
	background: rgba(223, 211, 187, 0.48);
	color: var(--beyou-wa-olive);
}

.beyou-wa-option-icon svg {
	width: 22px;
	height: 22px;
	fill: none;
	stroke: currentColor;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 1.45;
}

.beyou-wa-back {
	display: inline-flex;
	margin: -5px 0 9px;
	padding: 5px 0;
	border: 0;
	background: transparent;
	color: var(--beyou-wa-muted);
	font-family: "Rubik", "Assistant", Arial, sans-serif;
	font-size: 13px;
	cursor: pointer;
}

.beyou-wa-back:hover {
	color: var(--beyou-wa-clay);
}

.beyou-wa-selection {
	margin: 0 0 8px;
	color: var(--beyou-wa-clay);
	font-size: 13px;
	font-weight: 600;
}

.beyou-wa-preview {
	position: relative;
	margin: 3px 0 15px;
	padding: 13px;
	border: 1px solid #d0d9d2;
	border-radius: 18px;
	background: #eef2ef;
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.52);
}

.beyou-wa-preview-head {
	direction: ltr;
	margin-bottom: 9px;
	color: #647169;
	font-size: 11px;
	text-align: right;
}

.beyou-wa-preview-head span {
	display: inline-block;
	width: 7px;
	height: 7px;
	margin-right: 3px;
	border-radius: 50%;
	background: var(--beyou-wa-green);
}

.beyou-wa-preview p {
	margin: 0 !important;
	padding: 13px 15px 24px;
	border-radius: 13px 13px 3px 13px;
	background: #d9fdd3;
	box-shadow: 0 2px 8px rgba(57, 77, 63, 0.08);
	color: #223128;
	font-size: 14px;
	line-height: 1.65;
	white-space: pre-line;
}

.beyou-wa-preview time {
	display: block;
	direction: ltr;
	margin-top: -20px;
	padding: 0 10px 6px;
	color: #65776d;
	font-size: 9px;
	text-align: left;
}

.beyou-wa-notice {
	display: flex;
	align-items: flex-start;
	gap: 9px;
	margin: 0 0 15px;
	padding: 11px 13px;
	border: 1px solid rgba(197, 140, 110, 0.34);
	border-radius: 13px;
	background: rgba(221, 190, 169, 0.15);
	color: var(--beyou-wa-muted);
	font-size: 12px;
	line-height: 1.55;
}

.beyou-wa-notice svg {
	width: 19px;
	height: 19px;
	flex: 0 0 19px;
	fill: none;
	stroke: var(--beyou-wa-clay);
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 1.7;
}

.beyou-wa-notice strong {
	color: var(--beyou-wa-ink);
	font-weight: 600;
}

.beyou-wa-confirm,
.beyou-wa-cancel {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 53px;
	border-radius: 999px;
	font-family: "Rubik", "Assistant", Arial, sans-serif;
	font-size: 15px;
	font-weight: 600;
	cursor: pointer;
	transition: border-color 180ms ease, background-color 180ms ease, color 180ms ease, transform 180ms ease;
}

.beyou-wa-confirm {
	gap: 8px;
	border: 1px solid #1da952;
	background: #1fae55;
	color: #fff;
}

.beyou-wa-confirm:hover {
	border-color: #168a42;
	background: #168f45;
	color: #fff;
	transform: translateY(-1px);
}

.beyou-wa-cancel {
	margin-top: 9px;
	border: 1px solid transparent;
	background: transparent;
	color: var(--beyou-wa-muted);
}

.beyou-wa-cancel:hover {
	border-color: var(--beyou-wa-border);
	background: rgba(255, 255, 255, 0.56);
	color: var(--beyou-wa-ink);
}

.beyou-wa-proof {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 7px;
	margin: 17px 0 0 !important;
	color: var(--beyou-wa-muted);
	font-size: 12px;
	line-height: 1.4;
	text-align: center;
}

.beyou-wa-proof > span {
	display: grid;
	place-items: center;
	width: 19px;
	height: 19px;
	border-radius: 50%;
	background: rgba(107, 112, 92, 0.12);
	color: var(--beyou-wa-olive);
	font-size: 12px;
	font-weight: 700;
}

@keyframes beyou-wa-fade-in {
	from { opacity: 0; }
	to { opacity: 1; }
}

@keyframes beyou-wa-panel-in {
	from { opacity: 0; transform: translateY(14px) scale(0.985); }
	to { opacity: 1; transform: none; }
}

@keyframes beyou-wa-step-in {
	from { opacity: 0; transform: translateX(8px); }
	to { opacity: 1; transform: none; }
}

@media (max-width: 700px) {
	/* Keep the existing WhatsApp launcher clear of Elementor's privacy banner. */
	body .yydev-chat-button {
		bottom: calc(82px + env(safe-area-inset-bottom)) !important;
		z-index: 2147483001 !important;
	}

	.yydev-chat-button .elementor-icon {
		font-size: 40px !important;
		padding: 6px !important;
	}

	/* Compact mobile-only layout for the privacy popup (Elementor template 12521). */
	#elementor-popup-modal-12521 .dialog-widget-content {
		width: 100% !important;
		margin: 0 !important;
	}

	#elementor-popup-modal-12521 .dialog-message {
		width: 100% !important;
		min-height: 0 !important;
		max-height: none !important;
		padding: 0 !important;
		overflow: visible !important;
	}

	#elementor-popup-modal-12521 .elementor-element-4e42ef8 {
		padding: 5px 36px 5px 8px !important;
	}

	#elementor-popup-modal-12521 .elementor-container,
	#elementor-popup-modal-12521 .elementor-column,
	#elementor-popup-modal-12521 .elementor-widget-wrap {
		min-height: 0 !important;
	}

	#elementor-popup-modal-12521 .elementor-element-15e4526,
	#elementor-popup-modal-12521 .elementor-element-15e4526 .elementor-widget-container,
	#elementor-popup-modal-12521 .elementor-element-15e4526 p {
		margin: 0 !important;
	}

	#elementor-popup-modal-12521 .elementor-element-15e4526 p {
		font-size: 12px !important;
		line-height: 1.3 !important;
	}

	#elementor-popup-modal-12521 .elementor-element-15e4526 br {
		display: none !important;
	}

	#elementor-popup-modal-12521 .dialog-close-button {
		top: 50% !important;
		right: auto !important;
		left: 8px !important;
		width: 24px !important;
		height: 24px !important;
		transform: translateY(-50%) !important;
	}

	.beyou-wa-fab {
		left: 13px;
		bottom: calc(13px + env(safe-area-inset-bottom));
		min-height: 50px;
		padding: 10px 16px;
		font-size: 14px;
	}

	.beyou-wa-dialog {
		place-items: end center;
		padding: 0;
	}

	.beyou-wa-panel {
		width: 100%;
		max-height: calc(100dvh - 12px);
		padding: 27px 20px calc(20px + env(safe-area-inset-bottom));
		border-right: 0;
		border-bottom: 0;
		border-left: 0;
		border-radius: 24px 24px 0 0;
	}

	.beyou-wa-panel::before {
		right: 52px;
		left: 52px;
	}

	.beyou-wa-close {
		top: 14px;
		left: 15px;
	}

	.beyou-wa-header {
		gap: 12px;
		padding-left: 42px;
	}

	.beyou-wa-brand-line {
		display: none;
	}

	.beyou-wa-step-meta {
		font-size: 10px;
	}

	.beyou-wa-progress {
		margin: 16px 0 21px;
	}

	.beyou-wa-panel h2 {
		font-size: 28px;
	}

	.beyou-wa-intro {
		margin-bottom: 17px;
		font-size: 14px;
	}

	.beyou-wa-options {
		gap: 8px;
	}

	.beyou-wa-options button {
		min-height: 57px;
		padding: 10px 15px 10px 42px;
		border-radius: 14px;
	}

	.beyou-wa-option-icon {
		width: 34px;
		height: 34px;
		flex-basis: 34px;
	}

	.beyou-wa-option-icon svg {
		width: 20px;
		height: 20px;
	}

	.beyou-wa-options button small {
		font-size: 11px;
	}
}

@media (max-width: 380px) {
	.beyou-wa-step-meta span {
		display: none;
	}

	.beyou-wa-panel {
		padding-right: 16px;
		padding-left: 16px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.beyou-wa-fab,
	.beyou-wa-inline-button,
	.beyou-wa-dialog,
	.beyou-wa-panel,
	.beyou-wa-step,
	.beyou-wa-dialog * {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
	}
}