/* Constructors – personal welcome (mobile first) */
.cnhi-off { display: none !important; }

.cnhi {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 14px;
	width: 100%;
	animation: cnwIn .45s cubic-bezier(.23, 1, .32, 1) both;
}
@keyframes cnwIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .cnhi { animation: none; } }

.cnhi > .cnhi-el { margin: 0 !important; max-width: 100%; }
html body .cnhi .elementor-element.cnhi-el { opacity: 1 !important; transform: none !important; visibility: visible !important; }
.cnhi .cnhi-p p { margin: 0; }

/* role switch */
html body .cnhi .cnhi-sw {
	display: inline-flex;
	gap: 4px;
	padding: 4px;
	border-radius: 999px;
	background: rgba(32, 38, 36, .62);
	border: 1.5px solid rgba(245, 243, 238, .28);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
}
html body .cnhi .cnhi-sw__b {
	appearance: none;
	-webkit-appearance: none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: 0 !important;
	box-shadow: none !important;
	margin: 0;
	min-height: 36px;
	padding: 0 16px !important;
	border-radius: 999px !important;
	background: transparent !important;
	color: #f5f3ee !important;
	font: 600 14px/1 Rubik, Assistant, sans-serif !important;
	letter-spacing: 0;
	text-transform: none;
	cursor: pointer;
	transition: background .2s, color .2s;
}
html body .cnhi .cnhi-sw__b:hover { background: rgba(245, 243, 238, .14) !important; }
html body .cnhi .cnhi-sw__b.is-on { background: #c8f135 !important; color: #202624 !important; }
html body .cnhi .cnhi-sw__b:focus-visible { outline: 2px solid #ff7a1a; outline-offset: 2px; }

/* small line under the button */
.cnhi-sub {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 2px 10px;
	font: 500 14px/1.4 Assistant, Rubik, sans-serif;
	color: rgba(245, 243, 238, .86);
}
.cnhi-sub .cnhi-dot { opacity: .5; }
.cnhi-link {
	display: inline-flex;
	align-items: center;
	min-height: 40px;
	color: #f5f3ee !important;
	text-decoration: underline;
	text-decoration-color: #c8f135;
	text-decoration-thickness: 2px;
	text-underline-offset: 4px;
}
.cnhi-link:hover { color: #c8f135 !important; }
.cnhi-note { white-space: nowrap; }
.cnhi-pv {
	font: 600 12px/1 Rubik, sans-serif;
	padding: 5px 8px;
	border-radius: 6px;
	background: #ff7a1a;
	color: #202624;
}
.cnhi[lang="ar"] { font-family: 'Noto Sans Arabic', Rubik, Assistant, sans-serif; }

@media (min-width: 768px) {
	.cnhi { gap: 18px; }
	.cnhi-sub { font-size: 15px; }
}
