/**
 * Anúncios de afiliado (front-end). Banner claramente identificado como
 * publicidade, com design contemporâneo, microinterações e brilho — tudo em
 * CSS puro (transform/opacity), sem JS extra e sem layout shift (CWV).
 * Cores sólidas do tema (combina com o site) + acentos laranja suaves.
 *
 * @package ImobProTheme
 */

.rcp-ad {
	--ad-accent: var(--rcp-primary, #ff6b35);
	--ad-glow: rgba(242, 106, 33, 0.30);

	position: relative;
	isolation: isolate;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	gap: 14px;
	margin: 36px 0;
	padding: 20px 18px 18px;
	border: 1px solid var(--rcp-border, #e9ecef);
	border-radius: var(--rcp-radius-lg, 16px);
	background-color: var(--rcp-surface, #fff);
	background-image: radial-gradient(120% 80% at 0% 0%, rgba(242, 106, 33, 0.06), transparent 60%);
	box-shadow: 0 6px 22px rgba(20, 24, 31, 0.06);
	transition: transform 320ms cubic-bezier(.25,.8,.25,1), box-shadow 320ms cubic-bezier(.25,.8,.25,1), border-color 320ms ease;
}

/* Barra de destaque (sinaliza patrocínio com elegância). */
.rcp-ad::before {
	content: "";
	position: absolute;
	inset: 0 0 auto 0;
	height: 3px;
	background: linear-gradient(90deg, var(--ad-accent), var(--rcp-accent, #ffa600));
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 460ms ease;
}
/* Brilho transversal no hover. */
.rcp-ad::after {
	content: "";
	position: absolute;
	top: 0;
	left: -130%;
	width: 60%;
	height: 100%;
	z-index: 2;
	pointer-events: none;
	background: linear-gradient(100deg, transparent, rgba(255, 255, 255, 0.35), transparent);
	transform: skewX(-18deg);
	transition: left 720ms ease;
}
.rcp-ad:hover {
	transform: translateY(-3px);
	box-shadow: 0 18px 44px rgba(20, 24, 31, 0.12), 0 0 0 1px var(--ad-glow);
	border-color: rgba(242, 106, 33, 0.30);
}
.rcp-ad:hover::before { transform: scaleX(1); }
.rcp-ad:hover::after { left: 140%; }

/* Rótulo obrigatório de transparência. */
.rcp-ad__label {
	align-self: flex-start;
	display: inline-flex;
	align-items: center;
	align-self: center;
	gap: 7px;
	font-size: 14px;
	font-weight: 800;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--rcp-text);
	background: var(--rcp-bg, #f1f3f5);
	border: 1px solid rgba(242, 106, 33, 0.20);
	border-radius: 999px;
	padding: 4px 11px;
}
.rcp-ad__label::before {
	content: "";
	width: 6px; height: 6px;
	border-radius: 999px;
	background: var(--ad-accent);
	box-shadow: 0 0 0 4px rgba(242, 106, 33, 0.16);
}

/* Mídia */
.rcp-ad__media { display: flex; justify-content: center; overflow: hidden; border-radius: var(--rcp-radius, 10px); }
.rcp-ad__media img, .rcp-ad__img { max-width: 100%; height: auto; display: block; border-radius: var(--rcp-radius, 10px); transition: transform 520ms ease; }
.rcp-ad:hover .rcp-ad__img { transform: scale(1.03); }
.rcp-ad__bannerlink { display: block; overflow: hidden; border-radius: var(--rcp-radius, 10px); }

/* Vídeo responsivo 16:9 (sem CLS). */
.rcp-ad__video { position: relative; width: 100%; aspect-ratio: 16 / 9; }
.rcp-ad__video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; border-radius: var(--rcp-radius, 10px); }

/* Texto */
.rcp-ad__copy { display: flex; flex-direction: column; gap: 6px; }
.rcp-ad__title { margin: 0; font-size: var(--rcp-fs-h3, 20px); line-height: 1.3; color: var(--rcp-text, #20242a); }
.rcp-ad__text { margin: 0; color: var(--rcp-muted, #6c757d); line-height: 1.55; }

/* Botões */
.rcp-ad__btns { display: flex; flex-wrap: wrap; gap: 10px; }
.rcp-ad__btn {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 11px 18px;
	border-radius: 999px;
	background: var(--ad-accent);
	color: #fff;
	font-weight: 700;
	text-decoration: none;
	line-height: 1;
	transition: transform 200ms ease, box-shadow 200ms ease, filter 200ms ease;
}
.rcp-ad__btn::after {
	content: "";
	position: absolute; inset: 0; z-index: -1;
	transform: translateX(-120%);
	background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.4), transparent);
	transition: transform 560ms ease;
}
.rcp-ad__btn:hover { transform: translateY(-2px); box-shadow: 0 10px 22px rgba(0, 0, 0, 0.16); color: #fff; }
.rcp-ad__btn:hover::after { transform: translateX(120%); }
.rcp-ad__btn:focus-visible { outline: 3px solid var(--ad-glow); outline-offset: 2px; }
.rcp-ad__btn svg { width: 18px; height: 18px; }

/* Cores por marca (mantém reconhecimento). */
.rcp-ad__btn--whatsapp { background: #25d366; }
.rcp-ad__btn--facebook { background: #1877f2; }
.rcp-ad__btn--instagram { background: linear-gradient(45deg, #f09433, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888); }
.rcp-ad__btn--youtube { background: #ff0000; }
.rcp-ad__btn--x { background: #111; }
.rcp-ad__btn--telegram { background: #229ed9; }

@media (max-width: 560px) {
	.rcp-ad__btns { flex-direction: column; }
	.rcp-ad__btn { width: 100%; justify-content: center; }
}

@media (prefers-reduced-motion: reduce) {
	.rcp-ad, .rcp-ad__btn, .rcp-ad__img { transition: none; }
	.rcp-ad::before { transform: scaleX(1); }
	.rcp-ad::after, .rcp-ad__btn::after { display: none; }
}