/* C&C Popup — front-end styles. Scoped to #cnc-popup. */

#cnc-popup {
	--cncp-accent: #D4AF37;
	--cncp-overlay: .7;
	--cncp-accent-hi: #F2D677;
	--cncp-accent-lo: #A9831F;
	--cncp-ease: cubic-bezier(.16, 1, .3, 1);
	--cncp-sheet: cubic-bezier(.32, .72, 0, 1);
	--cncp-font: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

	position: fixed;
	inset: 0;
	z-index: 2147483600;
	visibility: hidden;
	pointer-events: none;
	font-family: var(--cncp-font);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	line-height: 1.5;
	text-align: left;
}

@supports (color: color-mix(in srgb, red 50%, blue)) {
	#cnc-popup {
		--cncp-accent-hi: color-mix(in srgb, var(--cncp-accent) 62%, #fff);
		--cncp-accent-lo: color-mix(in srgb, var(--cncp-accent) 78%, #000);
	}
}

#cnc-popup *,
#cnc-popup *::before,
#cnc-popup *::after { box-sizing: border-box; }

#cnc-popup.is-visible { visibility: visible; pointer-events: auto; }

#cnc-popup [hidden] { display: none !important; }

/* Theme tokens ------------------------------------------------------- */

.cncp--dark {
	--cncp-text: #F9FFF2;
	--cncp-muted: rgba(249, 255, 242, .74);
	--cncp-faint: rgba(249, 255, 242, .46);
	--cncp-line: rgba(255, 255, 255, .09);
	--cncp-panel: rgba(255, 255, 255, .03);
	--cncp-chip: rgba(255, 255, 255, .055);
	--cncp-input-bg: rgba(255, 255, 255, .06);
	--cncp-input-bg-focus: rgba(255, 255, 255, .09);
	--cncp-input-border: rgba(255, 255, 255, .15);
	--cncp-placeholder: rgba(249, 255, 242, .38);
	--cncp-dialog-bg:
		radial-gradient(120% 120% at 0% 0%, #1C1910 0%, #0F0F11 46%, #0A0A0C 100%);
	--cncp-shadow: 0 40px 120px -24px rgba(0, 0, 0, .75), 0 18px 40px -18px rgba(0, 0, 0, .6);
	--cncp-hl-a: #FBE7A1;
	--cncp-hl-b: var(--cncp-accent);
	--cncp-hl-c: var(--cncp-accent-lo);
	color-scheme: dark;
}

.cncp--light {
	--cncp-text: #141414;
	--cncp-muted: rgba(20, 20, 20, .72);
	--cncp-faint: rgba(20, 20, 20, .5);
	--cncp-line: rgba(20, 20, 20, .09);
	--cncp-panel: rgba(212, 175, 55, .07);
	--cncp-chip: rgba(20, 20, 20, .05);
	--cncp-input-bg: #ffffff;
	--cncp-input-bg-focus: #ffffff;
	--cncp-input-border: rgba(20, 20, 20, .16);
	--cncp-placeholder: rgba(20, 20, 20, .4);
	--cncp-dialog-bg:
		radial-gradient(120% 120% at 0% 0%, #FFF7DA 0%, #F9FFF2 50%, #F5F8EC 100%);
	--cncp-shadow: 0 40px 110px -28px rgba(30, 24, 6, .45), 0 16px 36px -18px rgba(30, 24, 6, .3);
	--cncp-hl-a: var(--cncp-accent-lo);
	--cncp-hl-b: #8A6A12;
	--cncp-hl-c: var(--cncp-accent-lo);
	color-scheme: light;
}

/* Overlay + positioning ---------------------------------------------- */

.cncp__overlay {
	position: fixed;
	inset: 0;
	background: rgba(6, 6, 8, var(--cncp-overlay));
	-webkit-backdrop-filter: blur(6px) saturate(120%);
	backdrop-filter: blur(6px) saturate(120%);
	opacity: 0;
	transition: opacity .4s ease;
}

.cncp__wrap {
	position: fixed;
	inset: 0;
	display: flex;
	padding: 24px;
	overflow-y: auto;
	overscroll-behavior: contain;
	-webkit-overflow-scrolling: touch;
}

.cncp__dialog {
	position: relative;
	margin: auto;
	width: min(900px, 100%);
	border-radius: 26px;
	/* Visible so the country list can extend past the card. The glow is
	   clipped by .cncp__bg instead. The card is never a scroll container,
	   so Fluent Forms' scroll-to-error can't shift it. */
	overflow: visible;
	background: var(--cncp-dialog-bg);
	color: var(--cncp-text);
	border: 1px solid rgba(212, 175, 55, .32);
	box-shadow: var(--cncp-shadow);
	outline: none;
	opacity: 0;
	transform: translateY(16px) scale(.965);
	transition: opacity .38s ease, transform .6s var(--cncp-ease);
	isolation: isolate;
}

@supports (color: color-mix(in srgb, red 50%, blue)) {
	.cncp__dialog { border-color: color-mix(in srgb, var(--cncp-accent) 34%, transparent); }
}

.cncp--anim-slide .cncp__dialog { transform: translateY(56px); }
.cncp--anim-fade .cncp__dialog { transform: none; }

#cnc-popup.is-open .cncp__overlay { opacity: 1; }
#cnc-popup.is-open .cncp__dialog { opacity: 1; transform: none; }

#cnc-popup.is-closing .cncp__overlay { transition-duration: .25s; }
#cnc-popup.is-closing .cncp__dialog {
	transition: opacity .22s ease-in, transform .26s ease-in;
}

/* Decorative glow ----------------------------------------------------- */

.cncp__bg {
	position: absolute;
	inset: 0;
	z-index: -1;
	border-radius: inherit;
	overflow: hidden;
	pointer-events: none;
}

.cncp__glow,
.cncp__bg::after {
	content: "";
	position: absolute;
	pointer-events: none;
	border-radius: 50%;
	filter: blur(12px);
}

.cncp__glow {
	width: 460px;
	height: 460px;
	top: -190px;
	left: -150px;
	background: radial-gradient(circle, rgba(212, 175, 55, .34) 0%, rgba(212, 175, 55, 0) 66%);
	animation: cncp-breathe 7s ease-in-out infinite;
}

.cncp__bg::after {
	width: 380px;
	height: 380px;
	right: -170px;
	bottom: -200px;
	background: radial-gradient(circle, rgba(212, 175, 55, .18) 0%, rgba(212, 175, 55, 0) 66%);
}

.cncp--light .cncp__glow { opacity: .7; }

/* Close button ------------------------------------------------------- */

.cncp__close {
	position: absolute;
	top: 16px;
	right: 16px;
	z-index: 5;
	display: grid;
	place-items: center;
	width: 38px;
	height: 38px;
	padding: 0;
	margin: 0;
	border-radius: 50%;
	border: 1px solid var(--cncp-line);
	background: var(--cncp-chip);
	color: var(--cncp-text);
	cursor: pointer;
	line-height: 1;
	box-shadow: none;
	transition: background .2s ease, transform .3s var(--cncp-ease), border-color .2s ease;
}

.cncp__close:hover { background: rgba(255, 255, 255, .14); transform: rotate(90deg); }
.cncp--light .cncp__close:hover { background: rgba(20, 20, 20, .09); }
.cncp__close:focus-visible { outline: 2px solid var(--cncp-accent); outline-offset: 2px; }

/* Layout -------------------------------------------------------------- */

.cncp__main {
	display: grid;
	grid-template-columns: 1.06fr .94fr;
}

.cncp__col { padding: 44px 40px 38px; min-width: 0; }

.cncp__col--form {
	background: var(--cncp-panel);
	border-left: 1px solid var(--cncp-line);
	border-radius: 0 25px 25px 0;
	padding-top: 56px;
}

/* Content entrance (staggered by JS) --------------------------------- */

.cncp-in {
	opacity: 0;
	transform: translateY(10px);
	transition: opacity .55s ease, transform .7s var(--cncp-ease);
}

#cnc-popup.is-open .cncp-in { opacity: 1; transform: none; }
#cnc-popup.is-closing .cncp-in { transition-delay: 0s !important; }

/* Offer column -------------------------------------------------------- */

.cncp__badge {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	padding: 7px 13px 7px 11px;
	border-radius: 999px;
	font-size: 11.5px;
	line-height: 1.2;
	font-weight: 700;
	letter-spacing: .09em;
	text-transform: uppercase;
	color: var(--cncp-accent);
	background: rgba(212, 175, 55, .12);
	border: 1px solid rgba(212, 175, 55, .38);
}

.cncp--light .cncp__badge { color: var(--cncp-accent-lo); }

.cncp__badge-dot {
	position: relative;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--cncp-accent);
	flex: none;
}

.cncp__badge-dot::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: 50%;
	background: var(--cncp-accent);
	animation: cncp-ping 1.8s cubic-bezier(0, 0, .2, 1) infinite;
}

#cnc-popup .cncp__title {
	margin: 18px 0 14px;
	padding: 0;
	font-family: var(--cncp-font);
	font-size: clamp(25px, 1.25vw + 17px, 34px);
	line-height: 1.12;
	font-weight: 800;
	letter-spacing: -.025em;
	color: var(--cncp-text);
	text-transform: none;
	text-wrap: balance;
}

.cncp-title-line { display: block; }

.cncp-title-line--next {
	margin-top: .3em;
	font-size: .74em;
	font-weight: 750;
	letter-spacing: -.015em;
	line-height: 1.2;
}

.cncp-hl {
	background: linear-gradient(100deg, var(--cncp-hl-a) 0%, var(--cncp-hl-b) 42%, var(--cncp-hl-c) 70%, var(--cncp-hl-a) 100%);
	background-size: 220% 100%;
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	-webkit-text-fill-color: transparent;
	animation: cncp-sheen 6s ease-in-out infinite;
}

#cnc-popup .cncp__sub {
	margin: 0 0 22px;
	font-size: 15.5px;
	line-height: 1.55;
	color: var(--cncp-muted);
	text-wrap: pretty;
}

#cnc-popup .cncp__bullets {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 12px;
}

#cnc-popup .cncp__bullets li {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	margin: 0;
	padding: 0;
	font-size: 14.5px;
	line-height: 1.45;
	color: var(--cncp-text);
}

#cnc-popup .cncp__bullets li::before { content: none; }

.cncp__tick {
	flex: none;
	display: grid;
	place-items: center;
	width: 22px;
	height: 22px;
	margin-top: -1px;
	border-radius: 50%;
	color: #121212;
	background: linear-gradient(180deg, var(--cncp-accent-hi), var(--cncp-accent));
	box-shadow: 0 4px 12px -4px rgba(212, 175, 55, .7);
}

.cncp__proof {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-top: 26px;
	padding-top: 22px;
	border-top: 1px solid var(--cncp-line);
	font-size: 13.5px;
	font-weight: 600;
	color: var(--cncp-muted);
}

.cncp__avatars { display: inline-flex; }

.cncp__avatars span {
	display: grid;
	place-items: center;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	margin-left: -9px;
	color: rgba(18, 18, 18, .78);
	border: 2px solid #121212;
	background: linear-gradient(160deg, var(--cncp-accent-hi), var(--cncp-accent-lo));
}

.cncp__avatars span:first-child { margin-left: 0; }
.cncp__avatars span:nth-child(2) { background: linear-gradient(160deg, #F4E2A6, #C9A13A); }
.cncp__avatars span:nth-child(3) { background: linear-gradient(160deg, #E9D9A8, #9C7A22); }
.cncp--light .cncp__avatars span { border-color: #F9FFF2; }

/* Timer --------------------------------------------------------------- */

.cncp__timer {
	padding: 14px 14px 12px;
	border-radius: 16px;
	background: var(--cncp-chip);
	border: 1px solid var(--cncp-line);
}

.cncp__timer-label {
	margin: 0 0 10px;
	font-size: 12.5px;
	font-weight: 700;
	letter-spacing: .02em;
	color: var(--cncp-muted);
	text-align: center;
}

.cncp__timer-boxes {
	display: flex;
	align-items: flex-start;
	justify-content: center;
	gap: 6px;
}

.cncp__tbox {
	flex: 1 1 0;
	max-width: 76px;
	padding: 10px 0 8px;
	border-radius: 12px;
	text-align: center;
	background: rgba(0, 0, 0, .32);
	border: 1px solid rgba(212, 175, 55, .22);
	overflow: hidden;
}

.cncp--light .cncp__tbox { background: #fff; }

.cncp__tbox b {
	display: block;
	font-size: 26px;
	line-height: 1;
	font-weight: 800;
	font-variant-numeric: tabular-nums;
	letter-spacing: -.01em;
	color: var(--cncp-text);
}

.cncp__tbox b.tick { animation: cncp-tick .45s var(--cncp-ease); }

.cncp__tbox small {
	display: block;
	margin-top: 6px;
	font-size: 10px;
	line-height: 1;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--cncp-faint);
}

.cncp__timer-boxes > i {
	font-style: normal;
	font-weight: 800;
	font-size: 20px;
	line-height: 38px;
	color: var(--cncp-accent);
	opacity: .75;
}

.cncp__timer.is-ended .cncp__tbox b { color: var(--cncp-faint); }

/* Form (Fluent Forms, restyled) -------------------------------------- */

.cncp__form { margin-top: 18px; }

#cnc-popup .cncp__form .fluentform,
#cnc-popup .cncp__form .frm-fluent-form { margin: 0 !important; padding: 0 !important; background: none !important; }

#cnc-popup .cncp__form fieldset { margin: 0; padding: 0; border: 0; min-width: 0; }

#cnc-popup .cncp__form .ff-el-group { margin-bottom: 12px !important; }

#cnc-popup .cncp__form .ff-el-input--label { margin-bottom: 6px !important; padding: 0 !important; }

#cnc-popup .cncp__form .ff-el-input--label label {
	font-family: var(--cncp-font) !important;
	font-size: 12.5px !important;
	font-weight: 600 !important;
	line-height: 1.3 !important;
	letter-spacing: .01em;
	color: var(--cncp-muted) !important;
	margin: 0 !important;
}

#cnc-popup .cncp__form .ff-el-is-required.asterisk-right label::after { color: var(--cncp-accent) !important; }

#cnc-popup .cncp__form .ff-el-form-control {
	display: block;
	width: 100% !important;
	height: 50px !important;
	min-height: 50px;
	margin: 0 !important;
	padding: 0 16px !important;
	font-family: var(--cncp-font) !important;
	font-size: 16px !important;
	font-weight: 500;
	line-height: 50px;
	color: var(--cncp-text) !important;
	background: var(--cncp-input-bg) !important;
	border: 1px solid var(--cncp-input-border) !important;
	border-radius: 12px !important;
	box-shadow: none !important;
	transition: border-color .2s ease, box-shadow .2s ease, background-color .2s ease;
	-webkit-appearance: none;
	appearance: none;
}

#cnc-popup .cncp__form .ff-el-form-control::placeholder { color: var(--cncp-placeholder) !important; opacity: 1; }

#cnc-popup .cncp__form .ff-el-form-control:hover { border-color: rgba(212, 175, 55, .5) !important; }

#cnc-popup .cncp__form .ff-el-form-control:focus {
	outline: none !important;
	background: var(--cncp-input-bg-focus) !important;
	border-color: var(--cncp-accent) !important;
	box-shadow: 0 0 0 4px rgba(212, 175, 55, .2) !important;
}

#cnc-popup .cncp__form .ff-el-is-error .ff-el-form-control { border-color: #FF7A6E !important; }

#cnc-popup .cncp__form .error,
#cnc-popup .cncp__form .text-danger {
	margin-top: 6px !important;
	font-size: 12.5px !important;
	font-weight: 500;
	color: #FF8F84 !important;
}

.cncp--light .cncp__form .error,
.cncp--light .cncp__form .text-danger { color: #C62F22 !important; }

/* Phone field: intl-tel-input */
#cnc-popup .cncp__form .iti { display: block; width: 100%; }
#cnc-popup .cncp__form .iti input.ff-el-form-control { padding-left: 54px !important; }
#cnc-popup .cncp__form .iti__selected-flag { padding: 0 8px 0 14px; border-radius: 12px 0 0 12px; background: transparent !important; }
#cnc-popup .cncp__form .iti__selected-flag:hover { background: rgba(255, 255, 255, .05) !important; }
#cnc-popup .cncp__form .iti__arrow { border-top-color: var(--cncp-muted); }
#cnc-popup .cncp__form .iti__arrow--up { border-bottom-color: var(--cncp-muted); border-top-color: transparent; }

#cnc-popup .cncp__form .iti__country-list {
	z-index: 40;
	width: max-content;
	min-width: 280px;
	max-width: min(360px, calc(100vw - 64px));
	max-height: 240px;
	margin: 6px 0 0 -1px;
	padding: 6px 0;
	overflow-x: hidden;
	overflow-y: auto;
	white-space: nowrap;
	text-align: left;
	border-radius: 12px;
	border: 1px solid rgba(212, 175, 55, .3);
	background: #17171A;
	color: #F9FFF2;
	box-shadow: 0 24px 60px -12px rgba(0, 0, 0, .8);
}

#cnc-popup .cncp__form .iti__country-list--dropup { margin: 0 0 6px -1px; }

.cncp--light .cncp__form .iti__country-list { background: #fff; color: #141414; border-color: rgba(20, 20, 20, .14); }

#cnc-popup .cncp__form .iti__country {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 9px 14px;
	font-size: 14px;
	line-height: 1.3;
	overflow: hidden;
	text-overflow: ellipsis;
}
#cnc-popup .cncp__form .iti__flag-box { flex: none; margin: 0; }
#cnc-popup .cncp__form .iti__country-name { margin: 0; overflow: hidden; text-overflow: ellipsis; }
#cnc-popup .cncp__form .iti__dial-code { flex: none; margin-left: auto; padding-left: 8px; }
#cnc-popup .cncp__form .iti__country.iti__highlight { background: rgba(212, 175, 55, .18); }
#cnc-popup .cncp__form .iti__dial-code { color: var(--cncp-faint); }
#cnc-popup .cncp__form .iti__divider { border-bottom-color: var(--cncp-line); }

/* On phones intl-tel-input opens its list in a full-screen layer on <body>. */
.iti--container,
.iti--fullscreen-popup.iti--container { z-index: 2147483640 !important; }

/* Submit button */
#cnc-popup .cncp__form .ff_submit_btn_wrapper,
#cnc-popup .cncp__form .ff-el-group.ff-text-left { margin: 6px 0 0 !important; text-align: center; }

#cnc-popup .cncp__form .ff-btn-submit,
#cnc-popup .cncp__form button[type="submit"] {
	position: relative;
	overflow: hidden;
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: 100% !important;
	min-height: 56px;
	margin: 0 !important;
	padding: 14px 20px !important;
	font-family: var(--cncp-font) !important;
	font-size: 16px !important;
	font-weight: 750 !important;
	line-height: 1.2 !important;
	letter-spacing: .005em;
	text-transform: none !important;
	color: #121212 !important;
	background: var(--cncp-accent) !important;
	background: linear-gradient(180deg, var(--cncp-accent-hi) 0%, var(--cncp-accent) 52%, var(--cncp-accent-lo) 100%) !important;
	border: 0 !important;
	border-radius: 14px !important;
	box-shadow: 0 14px 30px -12px rgba(212, 175, 55, .75), inset 0 1px 0 rgba(255, 255, 255, .5) !important;
	cursor: pointer;
	transition: transform .25s var(--cncp-ease), box-shadow .25s ease, filter .2s ease !important;
}

#cnc-popup .cncp__form .ff-btn-submit::after {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: -60%;
	width: 45%;
	background: linear-gradient(100deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, .55) 50%, rgba(255, 255, 255, 0) 100%);
	transform: skewX(-18deg);
	animation: cncp-shine 3.6s ease-in-out infinite 1.2s;
	pointer-events: none;
}

#cnc-popup .cncp__form .ff-btn-submit:hover {
	transform: translateY(-1px);
	filter: brightness(1.05);
	box-shadow: 0 18px 38px -12px rgba(212, 175, 55, .9), inset 0 1px 0 rgba(255, 255, 255, .5) !important;
}

#cnc-popup .cncp__form .ff-btn-submit:active { transform: translateY(0) scale(.99); }
#cnc-popup .cncp__form .ff-btn-submit:focus-visible { outline: 3px solid var(--cncp-accent-hi) !important; outline-offset: 3px; }
#cnc-popup .cncp__form .ff-btn-submit[disabled],
#cnc-popup .cncp__form .ff-btn-submit.disabled { opacity: .75; cursor: progress; }

#cnc-popup .cncp__form .ff-message-success { display: none !important; }
#cnc-popup .cncp__form .ff-errors-in-stack { margin-top: 10px; color: #FF8F84; font-size: 13px; }

/* Decline + small print ----------------------------------------------- */

#cnc-popup .cncp__decline {
	display: block;
	margin: 14px auto 0;
	padding: 6px 8px;
	border: 0;
	background: none;
	box-shadow: none;
	font-family: var(--cncp-font);
	font-size: 13.5px;
	font-weight: 500;
	line-height: 1.3;
	color: var(--cncp-faint);
	text-decoration: underline;
	text-decoration-color: rgba(212, 175, 55, .45);
	text-underline-offset: 4px;
	cursor: pointer;
	transition: color .2s ease;
}

#cnc-popup .cncp__decline:hover { color: var(--cncp-text); background: none; }
#cnc-popup .cncp__decline:focus-visible { outline: 2px solid var(--cncp-accent); outline-offset: 2px; border-radius: 6px; }

#cnc-popup .cncp__fine {
	margin: 10px 0 0;
	font-size: 11.5px;
	line-height: 1.5;
	text-align: center;
	color: var(--cncp-faint);
}

/* Success state -------------------------------------------------------- */

.cncp__success {
	padding: 64px 40px 52px;
	text-align: center;
	animation: cncp-rise .6s var(--cncp-ease) both;
}

.cncp__success[hidden] { display: none; }

#cnc-popup.is-success .cncp__dialog { width: min(540px, 100%); }

.cncp__success-icon {
	width: 76px;
	height: 76px;
	margin: 0 auto 22px;
	color: var(--cncp-accent);
	filter: drop-shadow(0 10px 24px rgba(212, 175, 55, .45));
}

.cncp__success-icon svg { width: 100%; height: 100%; }
.cncp__success-icon circle { stroke-dasharray: 160; stroke-dashoffset: 160; animation: cncp-draw .8s .1s var(--cncp-ease) forwards; }
.cncp__success-icon path { stroke-dasharray: 48; stroke-dashoffset: 48; animation: cncp-draw .5s .6s var(--cncp-ease) forwards; }

#cnc-popup .cncp__success-title {
	margin: 0 0 10px;
	font-family: var(--cncp-font);
	font-size: 30px;
	line-height: 1.15;
	font-weight: 800;
	letter-spacing: -.02em;
	color: var(--cncp-text);
	outline: none;
}

#cnc-popup .cncp__success-text {
	max-width: 400px;
	margin: 0 auto 26px;
	font-size: 16px;
	line-height: 1.55;
	color: var(--cncp-muted);
}

#cnc-popup .cncp__success-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	padding: 0 26px;
	border-radius: 999px;
	border: 1px solid rgba(212, 175, 55, .5);
	background: rgba(212, 175, 55, .12);
	color: var(--cncp-text);
	font-family: var(--cncp-font);
	font-size: 15px;
	font-weight: 700;
	cursor: pointer;
	transition: background .2s ease, transform .25s var(--cncp-ease);
}

#cnc-popup .cncp__success-btn:hover { background: rgba(212, 175, 55, .22); transform: translateY(-1px); }

/* Theme-proof buttons: some themes style every <button> (gold fill,
   padding, capitalized text). Undo that inside the popup. */
#cnc-popup button.cncp__close,
#cnc-popup button.cncp__decline,
#cnc-popup button.cncp__success-btn {
	font-family: var(--cncp-font) !important;
	text-transform: none !important;
	letter-spacing: normal !important;
	text-shadow: none !important;
	box-shadow: none !important;
	min-width: 0 !important;
	min-height: 0 !important;
}

#cnc-popup button.cncp__close {
	width: 38px !important;
	height: 38px !important;
	padding: 0 !important;
	border-radius: 50% !important;
	border: 1px solid var(--cncp-line) !important;
	background: var(--cncp-chip) !important;
	color: var(--cncp-text) !important;
	line-height: 1 !important;
}
#cnc-popup button.cncp__close:hover { background: rgba(255, 255, 255, .14) !important; }
#cnc-popup.cncp--light button.cncp__close:hover { background: rgba(20, 20, 20, .09) !important; }

#cnc-popup button.cncp__decline {
	width: auto !important;
	height: auto !important;
	padding: 6px 8px !important;
	border: 0 !important;
	border-radius: 6px !important;
	background: none !important;
	color: var(--cncp-faint) !important;
	font-size: 13.5px !important;
	font-weight: 500 !important;
	line-height: 1.3 !important;
}
#cnc-popup button.cncp__decline:hover { color: var(--cncp-text) !important; background: none !important; }

#cnc-popup button.cncp__success-btn {
	min-height: 48px !important;
	padding: 0 26px !important;
	border-radius: 999px !important;
	border: 1px solid rgba(212, 175, 55, .5) !important;
	background: rgba(212, 175, 55, .12) !important;
	color: var(--cncp-text) !important;
	font-size: 15px !important;
	font-weight: 700 !important;
}
#cnc-popup button.cncp__success-btn:hover { background: rgba(212, 175, 55, .22) !important; }

#cnc-popup .cncp__form .ff-btn-submit { letter-spacing: normal !important; }

/* Keep the page still and hide the chat bubble while the popup is open. */
html.cncp-lock,
html.cncp-lock body { overflow: hidden !important; }
html.cncp-lock body { padding-right: var(--cncp-sbw, 0px) !important; }
html.cncp-lock .zsiq_floatmain,
html.cncp-lock #zsiq_float,
html.cncp-lock .zsiq-float,
html.cncp-lock [data-id="zsalesiq"] { visibility: hidden !important; }

/* Tablet --------------------------------------------------------------- */

@media (max-width: 900px) {
	.cncp__dialog { width: min(580px, 100%); }

	.cncp__main {
		display: flex;
		flex-direction: column;
		padding: 40px 36px 30px;
	}

	.cncp__col { display: contents; }

	.cncp__badge { align-self: flex-start; }
	.cncp__badge { order: 1; }
	.cncp__title { order: 2; }
	.cncp__sub { order: 3; }
	.cncp__bullets { order: 4; }
	.cncp__timer { order: 5; margin-top: 22px; }
	.cncp__form { order: 6; }
	.cncp__proof { order: 7; justify-content: center; margin-top: 18px; padding-top: 0; border-top: 0; }
	.cncp__decline { order: 8; }
	.cncp__fine { order: 9; }

	#cnc-popup .cncp__title { padding-right: 34px; }
}

/* Phone ---------------------------------------------------------------- */

@media (max-width: 600px) {
	.cncp__wrap { padding: 12px; }

	.cncp__main { padding: 28px 20px 20px; }

	#cnc-popup .cncp__title { margin: 14px 0 10px; font-size: 24px; line-height: 1.14; padding-right: 30px; }
	#cnc-popup .cncp__sub { margin-bottom: 16px; font-size: 14.5px; }
	#cnc-popup .cncp__bullets { gap: 9px; }
	#cnc-popup .cncp__bullets li { font-size: 14px; gap: 10px; }
	.cncp__tick { width: 20px; height: 20px; }
	.cncp__badge { font-size: 10.5px; padding: 6px 11px 6px 10px; }

	.cncp__timer { margin-top: 18px; padding: 11px 10px 10px; }
	.cncp__timer-label { margin-bottom: 8px; font-size: 12px; }
	.cncp__tbox { padding: 8px 0 7px; border-radius: 10px; }
	.cncp__tbox b { font-size: 22px; }
	.cncp__timer-boxes > i { line-height: 32px; font-size: 17px; }

	.cncp__form { margin-top: 14px; }
	#cnc-popup .cncp__form .ff-el-group { margin-bottom: 10px !important; }
	#cnc-popup .cncp__form .ff-el-form-control { height: 48px !important; min-height: 48px; line-height: 48px; }
	#cnc-popup .cncp__form .ff-btn-submit { min-height: 54px; font-size: 15.5px !important; }

	.cncp__proof { margin-top: 14px; font-size: 13px; }
	.cncp__avatars span { width: 26px; height: 26px; }

	.cncp__close { top: 12px; right: 12px; }
	#cnc-popup button.cncp__close { width: 34px !important; height: 34px !important; }

	.cncp__success { padding: 52px 24px 36px; }
	#cnc-popup .cncp__success-title { font-size: 26px; }

	/* Bottom sheet */
	.cncp--m-sheet .cncp__wrap { padding: 0; padding-top: 24px; }
	.cncp--m-sheet .cncp__dialog {
		margin: auto 0 0;
		width: 100%;
		border-radius: 24px 24px 0 0;
		border-bottom: 0;
		transform: translateY(100%);
		transition: opacity .3s ease, transform .55s var(--cncp-sheet);
		padding-bottom: env(safe-area-inset-bottom, 0px);
	}
	.cncp--m-sheet .cncp__dialog::before {
		content: "";
		position: absolute;
		top: 8px;
		left: 50%;
		width: 40px;
		height: 4px;
		margin-left: -20px;
		border-radius: 4px;
		background: var(--cncp-line);
		z-index: 4;
	}
	.cncp--m-sheet.is-success .cncp__dialog { width: 100%; }
	#cnc-popup.cncp--m-sheet.is-open .cncp__dialog { transform: none; }
	#cnc-popup.cncp--m-sheet.is-closing .cncp__dialog { transform: translateY(100%); transition: transform .3s ease-in, opacity .3s ease-in; }
}

/* Short screens (landscape phones, small laptops) ----------------------- */

@media (max-height: 560px) and (min-width: 601px) {
	.cncp__wrap { padding: 12px; }
	.cncp__col { padding-top: 30px; padding-bottom: 26px; }
	.cncp__col--form { padding-top: 40px; }
}

/* Motion preferences --------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
	#cnc-popup *,
	#cnc-popup *::before,
	#cnc-popup *::after {
		animation: none !important;
	}
	.cncp__dialog,
	.cncp-in,
	.cncp--m-sheet .cncp__dialog {
		transform: none !important;
		transition: opacity .2s linear !important;
	}
	.cncp__success-icon circle,
	.cncp__success-icon path { stroke-dashoffset: 0; }
}

/* Keyframes ------------------------------------------------------------ */

@keyframes cncp-ping {
	0% { transform: scale(1); opacity: .75; }
	80%, 100% { transform: scale(2.6); opacity: 0; }
}

@keyframes cncp-sheen {
	0%, 100% { background-position: 0% 50%; }
	50% { background-position: 100% 50%; }
}

@keyframes cncp-breathe {
	0%, 100% { transform: scale(1); opacity: .9; }
	50% { transform: scale(1.08); opacity: 1; }
}

@keyframes cncp-shine {
	0% { left: -60%; }
	38%, 100% { left: 130%; }
}

/* Number stays visible at every frame, so a paused animation never hides it. */
@keyframes cncp-tick {
	0% { transform: translateY(-28%); color: var(--cncp-accent); }
	100% { transform: none; }
}

@keyframes cncp-draw { to { stroke-dashoffset: 0; } }

@keyframes cncp-rise {
	from { opacity: 0; transform: translateY(12px); }
	to { opacity: 1; transform: none; }
}