/* ===========================================================
   RewardRace — Footer Card v2
   Soft card w/ brand intro + gradient-bordered contact cards.
   =========================================================== */

.rrew-fcard {
	--rrfc-bg:         var(--rr-bg);
	--rrfc-text:       var(--rr-heading);
	--rrfc-body:       var(--rr-text);
	--rrfc-soft:       var(--rr-muted);
	--rrfc-faint:      var(--rr-subtle);
	--rrfc-border:     var(--rr-border);
	--rrfc-card-bg:    var(--rr-surface);
	--rrfc-pill-bg:    var(--rr-brand-tint);
	--rrfc-contact-bg: var(--rr-bg);
	--rrfc-accent:     var(--rr-brand);

	background: var(--rrfc-bg);
	color: var(--rrfc-body);
	font-family: var(--rr-font-sans);
	box-sizing: border-box;
	padding: var(--rr-section-y) 0;
}
.rrew-fcard *, .rrew-fcard *::before, .rrew-fcard *::after { box-sizing: border-box; }

.rrew-fcard--dark,
html[data-theme="dark"] .rrew-fcard--auto {
	--rrfc-contact-bg: var(--rr-surface-2);
}

.rrew-fcard__inner {
	max-width: var(--rr-container);
	margin: 0 auto;
	padding: 0 var(--rr-section-x);
}

.rrew-fcard__container {
	background: var(--rrfc-card-bg);
	border: 1px solid var(--rrfc-border);
	border-radius: var(--rr-radius-2xl);
	padding: var(--rr-space-10) var(--rr-space-12);
	display: grid;
	grid-template-columns: 1.4fr 1fr;
	gap: var(--rr-space-12);
	align-items: start;
	box-shadow: var(--rr-shadow-md);
}

.rrew-fcard .rrew-fcard__eyebrow {
	display: inline-flex;
	align-items: center;
	gap: var(--rr-space-2);
	padding: 7px 16px 7px 12px;
	background: var(--rrfc-pill-bg);
	border: 1px solid transparent;
	border-radius: var(--rr-radius-pill);
	font-size: var(--rr-fs-2xs);
	font-weight: 700;
	letter-spacing: var(--rr-tracking-wide);
	text-transform: uppercase;
	color: var(--rrfc-accent);
	margin-bottom: var(--rr-space-5);
}

.rrew-fcard__eyebrow-dot {
	width: 8px; height: 8px;
	border-radius: 50%;
	background: var(--rrfc-accent);
	display: inline-block;
	animation: rrfc-pulse 2s var(--rr-ease-out) infinite;
}
@keyframes rrfc-pulse {
	0%, 100% { transform: scale(1); opacity: 1; }
	50%      { transform: scale(1.3); opacity: .7; }
}

.rrew-fcard__heading-image {
	display: block;
	max-width: 100%;
	height: auto;
	object-fit: contain;
	margin: 0 0 var(--rr-space-5);
}

.rrew-fcard .rrew-fcard__title {
	font-size: var(--rr-fs-h2);
	font-weight: 800;
	letter-spacing: var(--rr-tracking-tight);
	line-height: var(--rr-lh-tight);
	margin: 0 0 var(--rr-space-5);
	color: var(--rrfc-text);
	text-wrap: balance;
}
.rrew-fcard__title-lead { display: inline; }
.rrew-fcard__title-accent {
	display: inline;
	color: var(--rrfc-accent);
	font-weight: 800;
	margin-left: .12em;
}

.rrew-fcard__desc {
	font-size: var(--rr-fs-md);
	line-height: var(--rr-lh-relaxed);
	color: var(--rrfc-soft);
	margin: 0;
	max-width: 56ch;
}

.rrew-fcard__right {
	display: flex;
	flex-direction: column;
	gap: var(--rr-space-4);
}

.rrew-contacts {
	display: flex;
	flex-direction: column;
	gap: var(--rr-space-3);
}

.rrew-contact {
	display: flex;
	align-items: center;
	gap: var(--rr-space-4);
	background: var(--rrfc-contact-bg);
	border: 1px solid var(--rrfc-border);
	border-radius: var(--rr-radius-lg);
	padding: 16px 20px;
	color: var(--rrfc-text);
	text-decoration: none;
	transition: border-color var(--rr-dur-fast) var(--rr-ease-out),
	            transform var(--rr-dur-fast) var(--rr-ease-out),
	            box-shadow var(--rr-dur-fast) var(--rr-ease-out);
}
a.rrew-contact:hover {
	border-color: var(--rrfc-accent);
	transform: translateY(-2px);
	box-shadow: var(--rr-shadow-md);
}
a.rrew-contact:hover .rrew-contact__icon {
	background: var(--rr-brand-gradient);
	color: #FFFFFF;
}

.rrew-contact__icon {
	display: inline-flex;
	width: 48px; height: 48px;
	border-radius: var(--rr-radius-md);
	background: var(--rr-brand-tint);
	color: var(--rrfc-accent);
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	transition: background var(--rr-dur-fast) var(--rr-ease-out),
	            color var(--rr-dur-fast) var(--rr-ease-out);
}
.rrew-contact__icon svg { width: 22px; height: 22px; }

.rrew-contact__text { min-width: 0; flex: 1; }

.rrew-contact__label {
	font-size: 10px;
	font-weight: 700;
	letter-spacing: var(--rr-tracking-wide);
	color: var(--rrfc-faint);
	text-transform: uppercase;
	margin-bottom: var(--rr-space-1);
}
.rrew-contact__value {
	font-size: var(--rr-fs-md);
	font-weight: 700;
	color: var(--rrfc-text);
	letter-spacing: var(--rr-tracking-snug);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.rrew-fcard__copy {
	font-size: var(--rr-fs-xs);
	color: var(--rrfc-faint);
	margin: var(--rr-space-2) 0 0;
}

@media (max-width: 1024px) {
	.rrew-fcard__container { gap: var(--rr-space-10); padding: var(--rr-space-8); }
}

@media (max-width: 880px) {
	.rrew-fcard { padding: var(--rr-space-8) 0; }
	.rrew-fcard__container {
		grid-template-columns: 1fr;
		gap: var(--rr-space-8);
		padding: var(--rr-space-6);
	}
	.rrew-fcard__copy { text-align: left; }
}

@media (max-width: 480px) {
	.rrew-fcard__inner { padding: 0 var(--rr-space-4); }
	.rrew-fcard__container { padding: var(--rr-space-5); border-radius: var(--rr-radius-xl); }
	.rrew-contact { padding: 14px 16px; gap: var(--rr-space-3); }
	.rrew-contact__icon { width: 42px; height: 42px; border-radius: var(--rr-radius-sm); }
	.rrew-contact__value { font-size: var(--rr-fs-sm); }
}