/* Repair CTA block — loaded on the front end and inside the editor. */

.rcta {
	--rcta-accent: #dd1a23;
	--rcta-accent-dark: #b3141c;
	--rcta-ink: #024472;

	position: relative;
	overflow: hidden;
	isolation: isolate;
	margin: 2.5rem 0;
	padding: clamp(1.75rem, 4vw, 3rem);
	border-radius: 20px;
	border: 1px solid rgba(255, 255, 255, .09);
	color: #fff;
	font-family: inherit;
}

.rcta--dark {
	background:
		radial-gradient(120% 140% at 100% 0%, color-mix(in srgb, var(--rcta-accent) 22%, transparent) 0%, transparent 55%),
		linear-gradient(160deg, color-mix(in srgb, var(--rcta-ink) 82%, #ffffff) 0%, var(--rcta-ink) 60%, color-mix(in srgb, var(--rcta-ink) 82%, #000000) 100%);
	box-shadow: 0 24px 60px -28px rgba(2,40,68,.55);
}

/* Fallback for browsers without color-mix(). */
@supports not (background: color-mix(in srgb, red 50%, blue)) {
	.rcta--dark { background: linear-gradient(160deg, #0b5a93 0%, var(--rcta-ink) 60%, #01304f 100%); }
}

.rcta--light {
	background: linear-gradient(160deg, #ffffff 0%, #f5f5f5 100%);
	border-color: rgba(19, 20, 20, .1);
	box-shadow: 0 18px 44px -26px rgba(19, 20, 20, .35);
	color: var(--rcta-ink);
}

.rcta__glow {
	position: absolute;
	inset: auto -10% -60% auto;
	width: 420px;
	height: 420px;
	border-radius: 50%;
	background: radial-gradient(circle, color-mix(in srgb, var(--rcta-accent) 28%, transparent) 0%, transparent 70%);
	z-index: -1;
	pointer-events: none;
}

.rcta__body { max-width: 44rem; }

.rcta__badge {
	display: inline-flex;
	align-items: center;
	gap: .5rem;
	padding: .4rem .85rem;
	margin-bottom: 1.1rem;
	border: 1px solid rgba(255, 255, 255, .16);
	border-radius: 999px;
	background: rgba(255, 255, 255, .06);
	font-size: .78rem;
	font-weight: 600;
	letter-spacing: .02em;
	text-transform: uppercase;
	color: #f1f1f1;
}

.rcta--light .rcta__badge {
	border-color: rgba(19, 20, 20, .12);
	background: rgba(19, 20, 20, .04);
	color: #595959;
}

.rcta__dot {
	width: 8px;
	height: 8px;
	flex: 0 0 8px;
	border-radius: 50%;
	background: #37d67a;
	box-shadow: 0 0 0 4px rgba(55, 214, 122, .18);
}

.rcta .rcta__title {
	margin: 0 0 .6rem;
	font-size: clamp(1.6rem, 3.4vw, 2.4rem);
	line-height: 1.15;
	font-weight: 800;
	letter-spacing: -.02em;
	color: inherit;
}

.rcta .rcta__text {
	margin: 0 0 1.6rem;
	font-size: clamp(1rem, 1.6vw, 1.115rem);
	line-height: 1.6;
	color: rgba(241,241,241, .82);
}

.rcta--light .rcta__text { color: rgba(19, 20, 20, .72); }

.rcta__actions {
	display: flex;
	flex-wrap: wrap;
	gap: .85rem;
}

.rcta .rcta__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .55rem;
	min-height: 52px;
	padding: .9rem 1.6rem;
	border-radius: 12px;
	border: 1px solid transparent;
	font-size: 1rem;
	font-weight: 700;
	line-height: 1;
	text-decoration: none;
	transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease;
}

.rcta .rcta__btn--primary {
	background: linear-gradient(180deg, var(--rcta-accent), var(--rcta-accent-dark));
	color: #3A1A69;
	box-shadow: 0 10px 24px -8px color-mix(in srgb, var(--rcta-accent) 70%, transparent);
}

.rcta .rcta__btn--primary:hover,
.rcta .rcta__btn--primary:focus-visible {
	color: #3A1A69;
	transform: translateY(-2px);
	box-shadow: 0 16px 30px -10px color-mix(in srgb, var(--rcta-accent) 80%, transparent);
}

.rcta .rcta__btn--ghost {
	background: rgba(255, 255, 255, .07);
	border-color: rgba(255, 255, 255, .22);
	color: #fff;
}

.rcta .rcta__btn--ghost:hover,
.rcta .rcta__btn--ghost:focus-visible {
	background: rgba(255, 255, 255, .14);
	color: #fff;
	transform: translateY(-2px);
}

.rcta--light .rcta__btn--ghost {
	background: rgba(19, 20, 20, .04);
	border-color: rgba(19, 20, 20, .16);
	color: var(--rcta-ink);
}

.rcta--light .rcta__btn--ghost:hover,
.rcta--light .rcta__btn--ghost:focus-visible {
	background: rgba(19, 20, 20, .08);
	color: var(--rcta-ink);
}

.rcta .rcta__btn:focus-visible {
	outline: 3px solid color-mix(in srgb, var(--rcta-accent) 40%, #fff);
	outline-offset: 3px;
}

.rcta__trust {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem 1.5rem;
	margin: 1.6rem 0 0;
	padding: 0;
	list-style: none;
	font-size: .9rem;
	color: rgba(241,241,241, .7);
}

.rcta--light .rcta__trust { color: rgba(19, 20, 20, .65); }

.rcta__trust li {
	display: flex;
	align-items: center;
	gap: .45rem;
	margin: 0;
}

.rcta__trust li::before {
	content: "";
	width: 16px;
	height: 16px;
	flex: 0 0 16px;
	background: no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23dd1a23' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
}

/* White checks on the dark card: brand red is too low-contrast on navy. */
.rcta--dark .rcta__trust li::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
}

.rcta__notice {
	margin: 1.25rem 0 0;
	padding: .6rem .85rem;
	border-radius: 8px;
	border: 1px dashed rgba(255, 255, 255, .3);
	font-size: .85rem;
	color: rgba(241,241,241, .8);
}

.rcta--light .rcta__notice {
	border-color: rgba(19, 20, 20, .25);
	color: rgba(19, 20, 20, .7);
}

@media (max-width: 560px) {
	.rcta__actions { flex-direction: column; align-items: stretch; }
	.rcta .rcta__btn { width: 100%; }
	.rcta__trust { gap: .55rem 1.1rem; font-size: .85rem; }
}

@media (prefers-reduced-motion: reduce) {
	.rcta .rcta__btn { transition: none; }
	.rcta .rcta__btn:hover { transform: none; }
}

/* Editor only: the buttons are non-clickable previews. */
.block-editor-block-list__layout .rcta__btn { cursor: default; }
.block-editor-block-list__layout .rcta__title,
.block-editor-block-list__layout .rcta__text { color: inherit; }
